horizontal navigation

**Death Slaught** · Dec 21 '07, 10:02 PM

Once again you cannot place division outside of the body tag.......1 sec and i'll fix it.

- Death

**quartzy** · Dec 21 '07, 10:07 PM

Do you mean that all divs are to be placed before the first body tag?

**Death Slaught** · Dec 21 '07, 10:13 PM

Originally posted by quartzy

Do you mean that all divs are to be placed before the first body tag?

No after

Code:

 <body> 
<div></div>
<div></div>
</body>

Nothing to my knowledge is allowed between the head and body tag.

Thanks, Death

**Death Slaught** · Dec 21 '07, 10:33 PM

Is this similiar to what you were going for? (To position this you will have to put it in a division, and give it an absolute position).

[HTML] <html>
<head>
<style type="text/css">

body {
margin:0;
padding:0;
}

ul {
float:left;
list-style-type:none;
}

li {
display:inline;
}

a {
float:left;
text-decoration:none ;
padding:0.2em 0.6em;
color:#000;
background-color:#fff;
border:1px solid #000;
}

a:hover {
color:#fff;
background-color:#000;
border:1px outset #fff;
}

a:active {
color:#fff;
background-color:#000;
border:1px inset #fff;
}

</style>
</head>

<body>

<ul>
<li><a href="#">Contac ts</a></li>
<li><a href="#">Referr als</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Benefi ts</a></li>
<li><a href="#">Your Say</a></li>
<li><a href="#">Site Map</a></li>
</ul>

</body>

</html>

[/HTML]

Hope it helps, Thanks, Death

**quartzy** · Dec 21 '07, 10:45 PM

thanks I will try it out an let you know.

**quartzy** · Dec 21 '07, 10:52 PM

Yes
they are just like what I want but with different colors, fonts, backgrounds which I can amend, but I would rather do them in an external style sheet and not embedded like this. I'll have a go and probaly will be back, thanks

**Death Slaught** · Dec 21 '07, 10:56 PM

Originally posted by quartzy

Yes
they are just like what I want but with different colors, fonts, backgrounds which I can amend, but I would rather do them in an external style sheet and not embedded like this. I'll have a go and probaly will be back, thanks

You can easily put it into an external stylesheet, I just made this way so I wouldn't have to seperate the HTML, and CSS.

Glad it helped, Death

**quartzy** · Dec 21 '07, 11:20 PM

hello again, they work good I placed the code in the external css and it all work good. Still have a problem with the header though.
Thanks for your help, css is so simple yet so hard to learn

**quartzy** · Dec 22 '07, 01:55 AM

I am back again, the code worked fine in an empty page but when I added it to my external style sheet, it has gone wrong again, the links appear at the edge of the header, all jumbled up and without their boxes in firefox but work OK in ie.
[code=css]
body {
font-family: Verdana, sans-serif;
margin: 0;
padding: 0;
}
#container {
position: relative;
width: 65em;
background-color: #E60073;
margin-left: auto;
margin-right: auto; color:#000000; font-size:1em
}
#header {
height: 10em;
padding: 1em;
align: center;
}

img {
border:0;
width:750px;
height: 110px;
}

ol {
float: right;
list-style-type:none;
background: #6600CC;
}
li {
display:inline;
text-size: 0.5em;
}
a {
float: right;
text-decoration:none ;
padding:0.2em, 0.6em;
color:#FFFFFF;
background-color:#6600CC;
border: 1px, solid, #FFFFFF;
font-weight: bold;
}
a:hover {
color:#FFFFFF;
background-color:#E60073;
border:1px outset #FFFFFF;
}
a:active {
color:#FFFFFF;
background-color:#E60073;
border:1px inset #FFFFFF;
}
[/code][html]
</head>
<body>
<div id="container" >
<div id="header">
<a href="index.htm l"><img border="0" src="images/netoworkarts.gi f"
width="750" height="110"></a>
<ol>
<li><a href="contacts. htm">Contacts</a></li>
<li><a href="referrals .htm">Referrals </a></li>
<li><a href="about.htm ">About</a></li>
<li><a href="benefits. htm">Benefits</a></li>
<li><a href="say.htm"> Your Say</a></li>
<li><a href="sitemap.h tm">Site Map</a></li>
</ol></div>
</body>
</html>[/html]
appreciate anoyones help on this.

**quartzy** · Dec 22 '07, 02:08 AM

I fixed the jumbled up problem but now I still have the problem of no border boxes, but I have them on hover.

**drhowarddrfine** · Dec 22 '07, 03:58 AM

Are we just making up our own tags as we go along or are we following the standards? Validate your html and css for your list of errors that need fixing.

**quartzy** · Dec 22 '07, 09:08 PM

I am learning this css and I cannot see any errors. I cannot validate it as I am developing a new website and it is not yet loaded any where. Needless to say I do not like your tone, you had to start somewhere didn't you?

**Markus** · Dec 22 '07, 10:07 PM

Originally posted by quartzy

I am learning this css and I cannot see any errors. I cannot validate it as I am developing a new website and it is not yet loaded any where. Needless to say I do not like your tone, you had to start somewhere didn't you?

http://validator.w3.or g/#validate_by_in put

Enter your markup there and validate it.

And don't speak down to moderators.

**drhowarddrfine** · Dec 22 '07, 11:45 PM

I wasn't following this thread, so I may have come across too strong, but I never understand how people come up with tags and attributes that don't exist. It's the third time in the last couple of days.

There are two validators, one for html and one for css. You don't need to be online with your site to validate. markusnoob gives the link for the html validator. Here is the CSS direct entry validator.

horizontal navigation

horizontal navigation

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment