[agentxcell]

Hi guys I have my portfolio up in firefox the way I need it can someone help me with the css hacks to get it to show up in IE the same way.....I am new to conditional comments and hacks.

http://www.dfw-consultants.com/staging/ZeroDegrees/

thanks for any help you can give also feedback on the site is welcomed too.

[Shiro]

Dont use hacks, only use conditional comments. Set it up like this:

<link rel="stylesheet" href="path/to/firefox/stylesheet.css" />
<!--[if IE 6]>
   <link rel="stylesheet" href="path/to/ie6/stylesheet.css" />
<![endif]-->
<!--[if IE 7]>
   <link rel="stylesheet" href="path/to/ie7/stylesheet.css" />
<![endif]-->

CSS loads in the order in which it appears in the head of the document. By doing this it loads your base stylesheet (firefox) first, then it loads the ie6 and ie7 stylesheets below that, which means that anything set in those stylesheets will take precedent over what was set in the ff stylesheet for those two browsers. So you code your site for firefox first, then go into ie, and make adjustments from what you have using the ie stylesheets.

[foolfodder]

I think that you'd probably be better off setting up a separate header div for the header. You can then give the header a height and put the header background image into it, and you won't need to use absolute positioning on the content div any more.

Also, I think that Firefox is adding 40px of padding to the left hand side of the ul, so you should be able to add padding-left: 40px; to the ul style without changing the display in Firefox

[foolfodder]

Also, don't use absolute positioning for the div.container. Let it run up against the bottom of the div.content and then give the div.container a margin on the top and left.

[agentxcell]

So if I give the div.container a margin on the top and left then it will overlap the background image?

[foolfodder]

Hi agentxcell,

Ok, you could do it without the header thing. Just add a margin or padding to the top of the div.content.

Personally I'd probably cut the header into two sections, put the top bit in the header and put the bottom bit in the content. Then have a solid dark grey as the background to "Background". You probably don't need most of the background image as it is solid grey.