Fri, 2009-04-24 11:24
Hey,
I am just messing around with Blogger trying to customize a theme.
And IE6 is geving me crap. Check the blog via:
The problem is the second post gets cut off from the left. I think it's because of margin collapsing. But sofar I haven't been able to fix it. Can anyone solve this for me?
And here's the code, don't get a hart attack it's just Blogger -- and no it doesn't validate by longshot and it never but that not the point.
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'> <head> <b:include data='blog' name='all-head-content'/> <title><data:blog.pageTitle/></title> <b:skin><![CDATA[/* ----------------------------------------------- Blogger Template Style Name: Minima Designer: Douglas Bowman URL: <a href="http://www.stopdesign.com" rel="nofollow">www.stopdesign.com</a> Date: 26 Feb 2004 Updated by: Blogger Team ----------------------------------------------- */ /* Variable definitions ==================== <Variable name="bgcolor" description="Page Background Color" type="color" default="#fff" value="#ffffff"> <Variable name="textcolor" description="Text Color" type="color" default="#000" value="#000000"> <Variable name="linkcolor" description="Link Color" type="color" default="#000" value="#000000"> <Variable name="pagetitlecolor" description="Blog Title Color" type="color" default="#000" value="#000000"> <Variable name="descriptioncolor" description="Blog Description Color" type="color" default="#000" value="#000000"> <Variable name="titlecolor" description="Post Title Color" type="color" default="#000" value="#000000"> <Variable name="bordercolor" description="Border Color" type="color" default="#ccc" value="#cccccc"> <Variable name="sidebarcolor" description="Sidebar Title Color" type="color" default="#000" value="#000000"> <Variable name="sidebartextcolor" description="Sidebar Text Color" type="color" default="#000" value="#000000"> <Variable name="visitedlinkcolor" description="Visited Link Color" type="color" default="#000" value="#000000"> <Variable name="bodyfont" description="Text Font" type="font" default="normal normal 100% Arial" value="normal normal 100% Arial"> <Variable name="headerfont" description="Sidebar Title Font" type="font" default="normal normal 78% Arial" value="normal normal 78% Arial"> <Variable name="pagetitlefont" description="Blog Title Font" type="font" default="normal normal 200% Arial" value="normal normal 200% Arial"> <Variable name="descriptionfont" description="Blog Description Font" type="font" default="normal normal 168% Georgia, Serif" value="normal normal 168% Georgia, Serif"> <Variable name="postfooterfont" description="Post Footer Font" type="font" default="normal normal 78% Arial" value="normal normal 78% Arial"> <Variable name="startSide" description="Side where text starts in blog language" type="automatic" default="left" value="left"> <Variable name="endSide" description="Side where text ends in blog language" type="automatic" default="right" value="right"> */ /* Use this with templates/template-twocol.html */ body { background:$bgcolor; margin:0; color:$textcolor; font:normal 13px arial; text-align: center; } a:link { color:$linkcolor; text-decoration:none; } a:visited { color:$visitedlinkcolor; text-decoration:none; } a:hover { color:#c30; text-decoration:none; } a img { border-width:0; } /* Header ----------------------------------------------- */ #header-wrapper { margin:0 auto; width:920px; } #header-inner { background-position: center; text-indent: -7777px; margin-left: auto; margin-right: auto; } #header { position: relative; display: block; background:url(#); height: 300px; } #header h1 { margin:5px 5px 0; padding:15px 20px .25em; line-height:1.2em; text-transform:uppercase; letter-spacing:.2em; font: $pagetitlefont; } #header a { color:$pagetitlecolor; text-decoration:none; } #header a:hover { color:$pagetitlecolor; } #header .description { margin:0 5px 5px; padding:0 20px 15px; text-transform:uppercase; letter-spacing:.2em; line-height: 1.4em; font: $descriptionfont; color: $descriptioncolor; } #header img { margin-$startSide: auto; margin-$endSide: auto; } /* Outer-Wrapper ----------------------------------------------- */ #outer-wrapper { width: 920px; margin:0 auto; padding:10px; text-align:$startSide; font: $bodyfont; } #main-wrapper { width: 550px; float:left; margin: 0 0 0 0; padding:0px 40px 0px 0px; border-right:1px dotted #ccc; min-height:400px; } #sidebar-wrapper { padding:40px 0px 30px 40px; width:259px; float: left; } /* Headings ----------------------------------------------- */ h2 { color:$sidebarcolor; } #sidebar h2 { font:normal 18px arial; margin:0 0 4px 0; } /* Posts ----------------------------------------------- */ h2.date-header { background:url(<a href="http://i30.photobucket.com/albums/c328/cartoonsmart/cal_icon.gif" rel="nofollow">http://i30.photobucket.com/albums/c328/cartoonsmart/cal_icon.gif</a>) no-repeat ; padding:1px 20px 1px 19px; font-size: 13px; } .post { margin:0 0 40px; } .post h3 { font:normal 24px georgia; margin:40px 0 13px 0; padding:0; color:$titlecolor; } .post h3 a { color:#c30; } .post h3 strong, .post h3 a:hover { color:$textcolor; } .post-body { margin:0 0 .75em; line-height: 1.6em } .post-body blockquote { line-height:1.3em; } .post-footer { color:#666; margin:20px 0 13px 0; background:#f9f9f9; padding:4px 10px; border-left:10px solid #ddd; border-top:1px dotted #ddd; } .post-author { background:url(<a href="http://i30.photobucket.com/albums/c328/cartoonsmart/cal_icon.gif" rel="nofollow">http://i30.photobucket.com/albums/c328/cartoonsmart/cal_icon.gif</a>) no-repeat ; padding:1px 0px 1px 19px } .comment-link { background:url(<a href="http://i30.photobucket.com/albums/c328/cartoonsmart/com_icon.gif" rel="nofollow">http://i30.photobucket.com/albums/c328/cartoonsmart/com_icon.gif</a>) no-repeat ; padding:1px 20px 1px 19px; } .post img { padding:4px; border:1px solid $bordercolor; } .post blockquote { margin:1em 20px; } .post blockquote p { margin:.75em 0; } /* Comments ----------------------------------------------- */ #comments h4 { font:normal 24px georgia; margin:40px 0 13px 0; padding:0; } #comments-block { margin:0 1.5em; line-height:1.6em; } #comments-block .comment-author { margin:0; padding:6px 15px; font:normal 12px arial; } #comments-block .comment-body { margin:.25em 0 0; } #comments-block .comment-footer { background:#000; margin:0; padding:6px 15px; font:normal 12px arial; } .comment-footer a{color:#fff;} . #comments-block .comment-body p { margin:18px 35px ; font:normal 13px/19px arial; } .deleted-comment { font-style:italic; color:gray; } .blog-pager-newer-link { float: right; background:#000; color:#fff; font:normal 12px/12px arial; padding:5px 10px 5px 10px; } #blog-pager-newer-link a { color:#fff; } #blog-pager-newer-link a:hover { background:#c30; color:#fff; } .blog-pager-older-link { float: left; background:#000; color:#fff; font:normal 12px/12px arial; padding:5px 10px 5px 10px; } #blog-pager-older-link a { color:#fff; } #blog-pager-older-link a:hover { background:#c30; color:#fff; } #blog-pager { text-align: center; } .feed-links { clear: both; line-height: 2.5em; } a.name { font-weight:bold; color:#000; } a.name:hover { color:#c30; text-decoration:none;} a.feed{ height:16px; background:url(<a href="http://i30.photobucket.com/albums/c328/cartoonsmart/feedicon.gif" rel="nofollow">http://i30.photobucket.com/albums/c328/cartoonsmart/feedicon.gif</a>) no-repeat 0 100% ; padding:1px 0 0 21px; } a:hover.feed{ background:url(<a href="http://i30.photobucket.com/albums/c328/cartoonsmart/feedicon.gif" rel="nofollow">http://i30.photobucket.com/albums/c328/cartoonsmart/feedicon.gif</a>) no-repeat ; } /* Sidebar Content ----------------------------------------------- */ .sidebar { color: $sidebartextcolor; line-height: 1.5em; } .sidebar ul { list-style:none; margin: 0 0 0; padding: 0 0 0; } .sidebar li { margin:0; padding-top:0; padding-$endSide:0; padding-bottom:.25em; padding-$startSide:15px; text-indent:-15px; line-height:1.5em; } .sidebar .widget, .main .widget { border-bottom:1px dotted $bordercolor; margin:0 0 1.5em; padding:0 0 1.5em; } .main .Blog { border-bottom-width: 0; } /* Profile ----------------------------------------------- */ .profile-img { float: $startSide; margin-top: 0; margin-$endSide: 5px; margin-bottom: 5px; margin-$startSide: 0; padding: 4px; border: 1px solid $bordercolor; } .profile-data { margin:0; text-transform:uppercase; letter-spacing:.1em; font: $postfooterfont; color: $sidebarcolor; font-weight: bold; line-height: 1.6em; } .profile-datablock { margin:.5em 0 .5em; } .profile-textblock { margin: 0.5em 0; line-height: 1.6em; } .profile-link { font: $postfooterfont; text-transform: uppercase; letter-spacing: .1em; } /* Footer ----------------------------------------------- */ #footer { color:#000; border-top:1px dotted #ccc; margin:0 0 0 0; padding:10px 0 0 0; clear:both; font:normal 12px arial; } #footer a { font-weight:bold; color:#000; } #footer a:hover { color:#c30; } ]]></b:skin> </head> <body> <div id='outer-wrapper'><div id='wrap2'> <!-- skip links for text browsers --> <span id='skiplinks' style='display:none;'> <a href='#main'>skip to main </a> | <a href='#sidebar'>skip to sidebar</a> </span> <div id='header-wrapper'> <b:section class='header' id='header' maxwidgets='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='KevRama (Kop)' type='Header'/> </b:section> </div> <div id='content-wrapper'> <div id='crosscol-wrapper' style='text-align:center'> <b:section class='crosscol' id='crosscol' showaddelement='no'/> </div> <div id='main-wrapper'> <b:section class='main' id='main' showaddelement='no'> <b:widget id='Blog1' locked='true' title='Blogberichten' type='Blog'/> </b:section> </div> <div id='sidebar-wrapper'> <b:section class='sidebar' id='sidebar' preferred='yes'> <b:widget id='BlogArchive1' locked='false' title='Blogarchief' type='BlogArchive'/> <b:widget id='Profile1' locked='false' title='Over mij' type='Profile'/> </b:section> </div> <!-- spacer for skins that want sidebar and main to be the same height--> </div> <!-- end content-wrapper --> <div id='footer-wrapper'><b:section class='footer' id='footer'/> <p>© Copyright 2009 <a class='name' href=''>KikiKiwi Industries</a>, alle rechten voorbehouden. <a class='feed' href=''>RSS</a></p> </div> </div></div> <!-- end outer-wrapper --> </body> </html>
