5 replies [Last post]
MattyG
Offline
newbie
Last seen: 17 years 10 weeks ago
Joined: 2004-08-06
Posts: 4
Points: 0

I am having a bit of trouble getting the hang of css... I am trying to design this site using pure css (no tables). Anyways....

I've just started and here is my page:

http://www.prhymemates.com/index3.php

Here is the style sheet:

http://www.prhymemates.com/style_02.css

Now, the problem is the way it displays in Firefox (and I assume it displays like this in Netscape too). Firefox puts a margin in the top of the page... it also is adding a margin at the bottom of the "content" id.

It looks the way I want it to in IE.

Can anyone help?

Thanks!!!!

Matt

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 40 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Can Somebody Help?

Hi MattyG,

It's the <p> tags that are causing the problems, margin-bottom:0; removes that gap, negative top margin on the container closes the top if you want that layout, also remove the <?xml version> line it won't help IE6,

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

MattyG
Offline
newbie
Last seen: 17 years 10 weeks ago
Joined: 2004-08-06
Posts: 4
Points: 0

Can Somebody Help?

Thanks for your help.

To put a negative margin on the container seems like a hack to me.... And I was under the impression that I wouldn't have to use values that don't make sense for standards compliant browsers... only IE. Regardless though... I'm going to give it a try because I'm sure you know what your talking about...

Also, for the <p> tag; I'll give that a try and see if it helps....

Wink

MattyG
Offline
newbie
Last seen: 17 years 10 weeks ago
Joined: 2004-08-06
Posts: 4
Points: 0

Can Somebody Help?

OK, so I changed the style sheet and gave the <p> a bottom margin of 0px. This did the trick!

Now the only problem is that gap on the top of the container. I thought it seemed wierd to give it a negative margin since I had the padding and margin set to 0px for the body tag. Well, I gave it a margin of -10px and it did move it up in Firefox, but it moved it above the viewable area in IE! So I still need to figure that out....

Sad

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 40 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Can Somebody Help?

Mattyg the negative margin may not be the best advise whilst it works in FF the results you are getting at the moment in IE are still being thrown out by the <?xml version> line you need to remove- it as per my previous post, to see how IE is actualy behaving in standards mode not quirks I'm not clever enough to know the results that would be happening with a browser in quirks mode (actualy I'm just not clever enough Crying)
Are the <p> there for a reason other than to pad out the content?

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

MattyG
Offline
newbie
Last seen: 17 years 10 weeks ago
Joined: 2004-08-06
Posts: 4
Points: 0

Can Somebody Help?

Oh yeah... I forgot about the <?xml version> tag. Those <p> tags were just thrown in for testing purposes. Once I put all of the content on that page there probably won't even be a <p> tag.

The reason why I have it laid out the way it is, is so that left column background will stretch along side the content on the right (where the <p> tags are now).

I'm going to see what happens when I take out the <?xml version> line.