...

View Full Version : My CSS Boxes not working in I.E - Why???



swiftmed
10-08-2007, 04:11 PM
Hey Guys,

i am using some CSS boxes with a dashed border on a site of mine, they come out perfectly in firefox, but in i.e they are all over the place, different sizes, dont line up etc.

This is the site: http://hylux.com.au/links.html

Can anybody tell me what im doing wrong, here is the css controling those boxes:


}
.links1 {background:#F2F9FF;
border:1px dashed #777777;
color: #777777;
font-size: 11px;
height: 125px;
width: 345px;
font-family: Arial, Helvetica, sans-serif;
}

BarrMan
10-08-2007, 04:22 PM
Try adding this:

* .links1
{
padding: 15px; /* Depends on how much you need */
margin: 15px; /* Depends on how much you need */
}

vtjustinb
10-08-2007, 04:44 PM
Can anybody tell me what im doing wrong, here is the css controling those boxes:

IE incorrectly expands boxes with a set height/width if their content grows too large to hold it. That doesn't happen in FF, which is why the boxes stay the same size.

If you want the boxes to stay the same size in IE you need to make the height large enough to accommodate all of your links.

BarrMan
10-08-2007, 04:49 PM
Or add this to your code:

* .links1
{
overflow: hidden;
}

I don't think this would happen if your have this value in IE.

swiftmed
10-08-2007, 05:26 PM
Hey Guys,

I tried all of your suggestions and only one which worked was this one:


overflow: hidden;

So thank yuou to all of you, especially BarrMan - ive thanked each of you :):)

_Aerospace_Eng_
10-08-2007, 05:33 PM
FYI you may not have had this problem if you had used a complete doctype in the first place. This is incorrect

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
It should be

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
or

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
with the latter one being the better doctype to use.

swiftmed
10-08-2007, 05:40 PM
FYI you may not have had this problem if you had used a complete doctype in the first place. This is incorrect

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
It should be

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
or

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
with the latter one being the better doctype to use.

Hey,

Thanks for that info. i wasnt aware i had the docutype wrong so thanks for pointing it out. ive left thanks for you :)

vtjustinb
10-08-2007, 06:15 PM
FYI you may not have had this problem if you had used a complete doctype in the first place. This is incorrect
with the latter one being the better doctype to use.

That's a great catch. Without those doctypes IE6 will render pages in quirks mode, which causes a lot of CSS spec rendering problems (mainly emulating IE5's incorrect box model).

Always use a valid doctype to make sure you're not forcing browsers into quirks modes.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum