2 replies [Last post]
adris72
Offline
newbie
Last seen: 17 years 50 weeks ago
Joined: 2004-08-23
Posts: 2
Points: 0

Hi

I have been sticking to table design like a dog to an old bone. But two days ago I started my first ccs layout design (and I'm very exited about) so you can tell that I'm really a newbbie.

My problem is that like many others, my design looks perfect as I want it in IE, but really odd in Mozzilla.
Here is the address:

http://www.redpointwebdesign.com/temp/links.html

And here is my external style sheet:

body{
background-color : #5767A4;
font : bold 12px/1.7em Verdana, Geneva, Arial, Helvetica, sans-serif;
margin : 0;
padding : 0;
color : #000000;
}

a {
font-weight : bold;
color : #0000FF;
text-decoration : none;
}
a:hover {
font-weight : bold;
color : #0000FF;
text-decoration : underline;
}

#menu {
position:relative;
width:750px;
height:20px;
z-index:2;
font: 10px;

}

#content {
background-color : #ffffff;
border : 3px #6666FF solid;
border-bottom : 15px solid #6699FF;
width : 750px;
padding : 15px 15px 0px;
position : absolute;
left : 10%;
top : 237px;
bottom : 15px;
}
#text {
margin-left : 250px;
; font-weight: bold

}
#subheader {
width : 750px;
height : 24px;
padding : 0px 10px;
background-color : #C4D9F9;
background-image : url(images/bg-menu.gif);
border-left : 0px;
border-right : 0px;
border-top : 0px;
border-bottom : 0px;
position : absolute;
left : 10%;
top : 213px;
z-index : 1;
}
#header {
width : 750px;
height : 180px;
padding : 0px 0px 0px 0px;
border : 3px solid #6699FF;
position : absolute;
left : 10%;
top : 30px;


}

_______________________________

(by the way, if you wonder why I didn't include the main image in the style sheet, is because I want a different one for each page.)

Please, please, can somebody be so kind of tell what I did so wrong? Thank you in advance

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 2 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

help to a newbbie

Hi adris72,
What I suggest you try is wrapping the three main divs (header, subheader and content) in a containing div then center it and set the width.
You should be able to get a better look cross browser that way.

Then to fix the content spilling out of the content container have a look at http://www.csscreator.com/attributes/containedfloat.php

Hope that helps

adris72
Offline
newbie
Last seen: 17 years 50 weeks ago
Joined: 2004-08-23
Posts: 2
Points: 0

I'll try

Thank you Tony, I'll try that and read these articles, I have a lot to learn...