ie6 .leftCol .rightCol .main
Reported by AngelaByDay | December 27th, 2010 @ 06:28 PM
Hello Nicole,
I'm taking my first steps OOCSS, and looking forward to getting immersed in it and improving my CSS and ditching bad habits!
At the moment i'm just getting to know the template, but
whenever i put margins on .leftCol and .rightCol, and put an image
that fills the remaining space in .main (in this case 470px), .main
breaks the template in ie6:
http://sarahjay.dbdtestzone.co.uk/470_margins/template.html
.myColumn {width:215px;} .mr25 {margin-right:25px;} .ml25
{margin-left:25px}
When i replace the margins with the same size padding, it's
fine!:
http://sarahjay.dbdtestzone.co.uk/470_padding/template.html
.myColumn {width:215px;} .pr25 {padding-right:25px;} .pl25
{padding-left:25px}
When i take 3 pixels off each margin it doesn't break, but of
course leaves a gap in other browsers, between the image and the
right side of .main:
http://sarahjay.dbdtestzone.co.uk/470_margin_minus3/template.html
I gather there has been some similar ie6 issues, and i've looked through the threads on OOCSS Google groups, but not sure if it's exactly the same issue… this seemed to be similar, but i think you've added a fix since then:
http://groups.google.com/group/object-oriented-css/browse_thread/th...
Thanks in advance for any help you can give me on this.
Anj :)
Comments and changes to this ticket
-
AngelaByDay December 29th, 2010 @ 02:43 AM
oh right... figured it out....
my margins are overwriting the ie6 hack in the template:
.leftCol{float:left;width:250px;margin-right:-3px;} .rightCol{float:right;width:300px;margin-left:-3px;}
to sort this i need to add a hack for my margins as well.
.mr25 {margin-right:25px;} .ml25 {margin-left:25px}
.mr25 {margin-right:22px;} .ml25 {margin-left:22px}
That's the badger!! :)
Please Sign in or create a free account to add a new ticket.
With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.
Create your profile
Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป