Thanks Been for helping with the new three columns. The two sidebars are now good and the center column is now dynamic but only sideways. I've had to change the overflow to auto so the content would show. With overflow on hidden or commented out it just displayed what was on the screen and nothing more. Strange seen as there is no height property. Still need to adjust the margins a little too. I'll wait 'till the columns are done first though. I'll post the code here just in the off chance someone stumbles across this post who knows what to do. I wish I could have just started from scratch.
<!-- The code -->
* Blogger Template Style
* Name: Mr. Moto Rising (Ellington style)
* Designer: Jeffrey Zeldman
* URL: www.zeldman.com
* Date: 23 Feb 2004
* Updated by: Blogger Team
* ----------------------------------------------- */
p.navigation-bar {background-color: #ffffff;}
p.navigation-bar {background-color: #ffffff;
text-align: center}
p.navigation-bar {background-color: #ffffff;
border: medium #ffffff solid;
text-align: center}
p.navigation-bar {background-color: #ffffff;
border: small #ffffff solid;
padding: 1%;
text-align: center}
p.navigation-bar a:link
p.navigation-bar a:visited
p.navigation-bar a:link {color: white;
text-decoration: none}
p.navigation-bar a:hover {background-color: #D3D3D3;
color: #ffffff;
text-decoration: none}
/* Variable definitions
====================
*/
/* Primary layout */
body {
margin: 0;
padding: 0;
border: 0;
text-align: center;
color: $mainTextColor;
font-size: small;
}
img {
border: 0;
display: block;
}
.clear {
clear: both;
}
/* Wrapper */
#outer-wrapper {
margin: 0 auto;
border: 0;
width: 100%;
text-align: left;
background: $mainBgColor url(http://www.) top right repeat-y;
font: $bodyFont;
}
/* Header */
#header-wrapper {
*/background: #bba url(http://www.blogblog.com/moto_mr/headbotborder.gif) bottom left repeat-x;
margin: 0 auto;
padding: 0 0 15px 0;
border: 0;
}
#header h1 {
text-align: left;
font-size: 200%;
color: $pageHeaderColor;
margin: 0;
padding: 15px 20px 0 20px;
background-image: url(http://www.blogblog.com/moto_mr/topper.gif);
background-repeat: repeat-x;
background-position: top left;
}
h1 a, h1 a:link, h1 a:visited {
color: $pageHeaderColor;
}
#header .description {
font-size: 110%;
text-align: left;
padding: 3px 20px 10px 23px;
margin: 0;
line-height:140%;
color: $blogDescriptionColor;
}
/* Nav Bar */
#navbar-wrapper {
padding: 0 16px;
}
#navbar {
width: 100%;
float: left;
}
/* Inner layout */
#content-wrapper {
width: 100%;
margin: 0 auto;
padding: 0px 0;
}
#main {
position: fixed;
padding: 15px 15px 15px 15px;
top: 200px;
left: 226px; /*Set left value to WidthOfLeftFrameDiv*/
right: 226px; /*Set right value to WidthOfRightFrameDiv*/
bottom: 0;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: auto; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar, #sidebar-l {
position: fixed;
padding: 5px 5px 5px 5px;
left: 0;
width: 226px; /*Width of left frame div*/
height: ;
overflow: vhidden; /*Disable scrollbars. Set to "scroll" to enable*/
}
#sidebar {
left: auto;
padding: 5px 5px 5px 5px;
right: 0;
width: 226px;
color: $sidebarTextColor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-l {
color: $sidebarTextColor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
/* Bottom layout */
#footer {
clear: left;
margin: 0;
padding: 0 20px;
border: 0;
text-align: left;
border-top: 1px solid #f9f9f9;
}
#footer .widget {
text-align: left;
margin: 0;
padding: 10px 0;
background-color: transparent;
}
/* Default links */
a:link, a:visited {
font-weight: bold;
text-decoration: none;
color: $linkColor;
background: transparent;
}
a:hover {
font-weight: bold;
text-decoration: underline;
color: $hoverLinkColor;
background: transparent;
}
a:active {
font-weight : bold;
text-decoration : none;
color: $hoverLinkColor;
background: transparent;
}
/* Typography */
.main p, .sidebar p {
line-height: 140%;
margin-top: 5px;
margin-bottom: 1em;
}
h2, h3, h4, h5 {
margin: 0;
padding: 0;
}
h2 {
font-size: 130%;
}
h2.date-header {
color: $dateHeaderColor;
}
.post h3 {
margin-top: 5px;
font-size: 120%;
}
.post-footer {
font-style: italic;
}
.sidebar h2 {
color: $sidebarHeaderColor;
}
.sidebar-l h2 {
color: $sidebarHeaderColor;
}
.sidebar .widget {
margin: 12px 0 13px 0;
padding: 0;
}
.sidebar-l .widget {
margin: 12px 0 13px 0;
padding: 0;
}
.main .widget {
margin: 12px 0 0 0 ;
}
li {
line-height: 160%;
}
.sidebar ul {
margin-left: 0;
margin-top: 0;
padding-left: 0;
}
.sidebar-l ul {
margin-left: 0;
margin-top: 0;
padding-left: 0;
}
.sidebar ul li {
list-style: disc url(http://www.blogblog.com/moto_mr/diamond.gif) inside;
vertical-align: top;
padding: 0;
margin: 0;
}
.sidebar-l ul li {
list-style: disc url(http://www.blogblog.com/moto_mr/diamond.gif) inside;
vertical-align: top;
padding: 0;
margin: 0;
}
.widget-content {
margin-top: 0.5em;
}
/* Profile
----------------------------------------------- */
.profile-datablock {
margin: 3px 0 5px 0;
line-height: 140%;
}
.profile-textblock {
margin-left: 0;
}
.profile-img {
float: left;
margin: 0 10px 5px 0;
border:4px solid #ccb;
}
#comments {
border: 0;
border-top: 1px dashed #eed;
margin: 10px 0 0 0;
padding: 0;
}
#comments h4 {
margin-top: 10px;
margin-bottom: -10px;
font-weight: normal;
font-style: italic;
text-transform: uppercase;
letter-spacing: 1px;
}
#comments dl dt {
font-weight: bold;
font-style: italic;
margin-top: 35px;
padding: 1px 0 0 18px;
background: transparent url(http://www.blogblog.com/moto_mr/commentbug.gif) top left no-repeat;
}
#comments dl dd {
padding: 0;
margin: 0;
}
.deleted-comment {
font-style:italic;
color:gray;
}
.feed-links {
clear: both;
line-height: 2.5em;
}
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
}
/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper {
padding-top: 0;
}
body#layout #header,
body#layout #content-wrapper,
body#layout #footer {
padding: 0;
}
]]>
From here everything is just contained in its own div.
No comments:
Post a Comment