3 replies [Last post]
himi
Offline
newbie
Last seen: 12 years 50 weeks ago
Joined: 2006-11-27
Posts: 2
Points: 0

Now, my layout was perfectly ok, until i put the top navigation. I made it like veerle's navigation: http://veerle.duoh.com/blog/comments/the_xhtml_css_template_phase_of_my_new_blog_part_2/.

Here's how mine looks like:
http://lena.dulce-splash.net/testpgs/x.php.

and this is the css i used for the navigation alone:
#top {
text-align:justify;
line-height:18px;
width:650px;
margin:0;
padding:0;
background:url(bg2.jpg) repeat-y #f0f393;
}

ul#nav {
width:650px;
background-color:#f0f393;
padding:0;
margin: 0;
}

ul#nav li {
list-style-type:none;
float:left;
text-indent:-9999px;
margin:0;
padding:0;
}

ul#nav li a {
border:0;
text-decoration:none;
display:block;
background:url(nav.gif) no-repeat;
margin:0;
padding:0;
}

li#content a:hover,li#content a:focus {
background-position:0 -59px;
}

li#moi a:link,li#moi a:visited {
background-position:-165px 0;
}

li#moi a:hover,li#moi a:focus {
background-position:-165px -59px;
}

li#site a:link,li#site a:visited {
background-position:-284px 0;
}

li#site a:hover,li#site a:focus {
background-position:-284px -59px;
}

li#links a:link,li#links a:visited {
background-position:-403px 0;
}

li#links a:hover,li#links a:focus {
background-position:-403px -59px;
}

li#main a:link,li#main a:visited {
background-position:-522px 0;
}

li#main a:hover,li#main a:focus {
background-position:-522px -59px;
}

body#content-page ul#nav li#content a {
background-position:0 -70px;
}

body#moi-page ul#nav li#moi a {
background-position:-109px -70px;
}

body#site-page ul#nav li#site a {
background-position:-218px -70px;
}

body#links-page ul#nav li#links a {
background-position:-327px -70px;
}

body#main-page ul#nav li#main a {
background-position:-436px -70px;
}

li#content a {
width:165px;
height:59px;
}

li#main a {
width:128px;
height:59px;
}

li#moi a,li#site a,li#links a {
width:119px;
height:59px;
}

I'm sort of new to css, but i do know some things. I dont want the space between the navigation and the header, and the content part. I want everything to be aligned. Help!

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 17 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

sigh. http://www.csscreator.

Verschwindende wrote:
  • CSS doesn't make pies

himi
Offline
newbie
Last seen: 12 years 50 weeks ago
Joined: 2006-11-27
Posts: 2
Points: 0

I put a transitional doctype

I put a transitional doctype instead, but nothing changes. It still has spacing on the navigation.

Edit: ok it worked now! Thanks alot..and sorry for not reading the first post.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 17 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Yay!

I'm quite impressed that simply adding a doctype fixed it up, now you know why we're so adamant abotu using them Laughing out loud

Glad you got it sorted, anything else we can help with for this site?

Verschwindende wrote:
  • CSS doesn't make pies