Min height problem [Archive] - WebDeveloper.com

Click to See Complete Forum and Search --> : Min height problem

LizzyB

02-15-2007, 08:33 AM

Hi,

I have set a min height on my page as I am just laying it out and havent the content yet (doing a site for someone else). I had to set this else my footer is going through the left nav. However its causing (in IE7) the little text I have got to shunt across to the right. It looks like its added in my padding twice. Ive had this before but ended up using P and brs to drop the footer down but I know thats bad coding. Can anyone help suggest the way to fix this. The page is here

http://www.whizzliz.co.uk/sjmvirtualservices/

Thanks
Liz

Hardbyte

02-15-2007, 09:21 AM

I use a brower detect function, where depending on the browser it imports either ie6.css/ie7.css/ff.css etc..

I found that min-height works for ff but with ie6/7 I use the following:

html>body .main_content_body {margin-top:10px; min-height:407px; position:inherit;}

I understand this is sloppycode, however I could like to know peoples thoughts...

ps: what works for me doesnt always work for others.

Centauri

02-15-2007, 09:42 AM

Hi again liz,

Main problem with this one is #maincontent padding should be margin : #maincontent{
background-image: url(navbg.jpg);
background-repeat:repeat-y;
min-height: 200px;
margin: 10px 10px 10px 160px;
}

There is also a spacing problem with the menu in IE6, as well as the hover being confined to the text. This is solved by giving the <a> some height : #navigation a{
display:block;
color:#FFFFFF;
font-weight:bold;
background-color:#61015B;
padding:5px;
text-align:center;
text-decoration: none;
line-height: 1.3em;
height: 1.3em;
}

Cheers
Graeme

Sorehead

02-15-2007, 09:48 AM

Hi,

Create a new stylesheet, call it ie-fix.css, place the following code in your css

#maincontent{
padding:10px;
}

Then add the following the following into the head of your html



You may want to change the doc type to an xhtml doctype as that seems to be the way you are coding.

e.g.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

That should work, hope that helps!

LizzyB

02-15-2007, 10:19 AM

Gosh CSS frys my brain - so many ways to do each thing!
Thanks - I shall have a look at both fixes to get more experience and see which i end up with.

Thanks again!
Liz