vchris

Can you post you select code and style if any?

I agree with you sniffy but I would stay away from css for now if I was him. Use a table for your page structure. Try and get it validated as html 4.01.W3C HTML Validator: http://validator.w3.org/If you have trouble, let us know

I checked with Firefox 2.0 and IE 7 and didn't see any issue. Everything seems fine. I think that's kinda weird. Are you saying that when you removed the selects the problem was gone?

Alright. The problem with the list location is the margin/padding on the ul itself. By default ul have a margin top and bottom. They also have left padding.You need to add#navigation ul {margin: 0; /* Removes all margins */padding: 0; /* Removes all padding */}Now you should have it placed where you want it. If you want a bit more top spacing you can always add top margin. margin: 1px 0px 0px 0px. First number is top.For your link, you need to add a link sections. The code below only affects links inside navigation id, ul list, li items. Understand how it works? So that's why you lost your custom links. #navigation ul li will not change a link.#navigation ul li a {color: #FFFFFF;text-decoration: none;}#navigation ul li a:hover { /* on hover */color: #000000;}I'm guessing you don't want to have the | part of the link. I would put the | outside of the a tag but within the li tag.As for the padding, if you increase these values padding: 0px 5px 0px 5px; you will increase the padding. Only increase the 5px values.

First, remove the spaces in your links.You want to display each list item inline not the ul. So remove the display: inline in your ul style (last line).Then add this to your css:#navigation ul li {display: inline;padding: 0px 5px 0px 5px;}padding will add spacing on the right and left of your links. The first number is top, second is right, third is bottom and last is left. You can play with those numbers depending on what you want.

If you want something that is secure I wouldn't rely on javascript for this. Anyone can disable javascript from their browser and override your security settings. I would try and make a 30 day trial thing with a server side scripting language and the only way I see you can monitor how many days is left is with a user account. You can't use only their IP since some users IP change every connection.I would make a login panel and when the 30 day is up the user is directed to a webpage as your say.

IE doesn't understand display: table-cell;What I would do is set a fixed size for each a tag. If your wrapper is 800 wide then make each nav link 200px wide.

Oh! I just noticed you have errors in your html code. This is the syntax for a link:<a href="destination">description</a>You have:<a href="destination">description |<a href="destination">description |See the problem?Should be:<a href="destination">description</a> |...You didn't close your a tag so the browser continues to link until the element is closed. Why not just have <li> for each link?<ul><li><a href="page.html">link</a></li><li><a href....</ul>If not then you should remove the list.

#navigation ul li a { color: #FFFFFF; }it would only mean changing your webpages from .html to .php so they can understand that there is php code in there (html still works).absolute path means that anywhere you are in your site you can link to a certain file (/images/image.jpg). / is the root of your site.

Why would he need to have file extensions in caps? What difference could that make? I've never ever done that and I don't think it matters.Steve Hoffman UK: Great! So they do support php in this case you will need to change the extension of your pages to .php so the web server can parse it as php. The magic line is <?php include('/navigation.php'); ?>Do you know if absolute paths work on your web server? (/images/image.jpg) or do you have to do images/image.jpg? It's simpler for you with absolute paths.

Possibly and it's firefox not foxfire

They seem the same size to me. I tested with Firefox 2 and IE 7.

Thanks ben. I agree! The font also looks weird... like it could look better but I'm limited to arial or verdana, the others are ugly. I thought about the changing the opacity on hover but opacities in css causes warnings when validating. I don't want any warnings or errors in my code. I guess I could always use a javascript to change images.Are you a client of 2wdhost.com? I'd prefer awdhost

I believe it's your menus margin.#menu {list-style-type:none; margin:0 0 100px 0; padding:0;}You set a margin of 100px at the bottom.

Well I'm not sure what kind of server you are running/developing your site on but if you server supports php, asp or coldfusion pages there is little you need to know to includes files, it's one line of code. If your server does not support those server-side scripting languages then the only other way I see is if you use Dreamweaver for developing your site, you could create a library item of your navigation and include it on all pages this way you don't need to know any server-side scripting languages and nothing special for the server either.The advantage of an external stylesheet is your code is tidier, it separates the css from the html. If ever down the road you want to change the colour of certain links on your page, you just change the property in the stylesheet and there you go no need to edit every page of your site.

Didn't you create a topic about this earlier?http://w3schools.invisionzone.com/index.php?showtopic=9891

welcome

I see the problem you have with your site.Still have those in your css?position:absolute;overflow:hidden;I think those are the reason for your problem. Try commenting them out.

it's style not tyle. You also forgot the ; after none

What do you have in your css now? Is the online version what you're working on now?

This could solve some problems, center your div like this:body { text-align: center; }maincontainer { margin: 0 auto; text-align: left; }

AH! I see what you mean. Hmmm that's weird, never seen that before. I'll check your code.Why do you have this: left:50%; position:absolute; margin-left:-397px; margin-top:0px; overflow:hidden;

This won't work since background images cannot be clicked. You'll need to add the images yourself (<img src="image.jpg" />). There are some bugs to horizontal navigations, one in particular is if you don't want spacing between each button don't have any line returns in your code between each button.You can also include some css for your nav.HTML:<div id="navigation"><ul><li><a href="#"><img src="image.jpg" /></li></a></ul></div>CSS:#navigation ul { margin: 0; padding: 0; } /* ul with no margin or padding */#navigation ul li { display: inline; } /* list is inline */a img { border: none; } /* no borders for images with links */If you want to repeat this on all pages of your site, you should use server-side includes (php, asp or coldfusion).

Seems fine in IE 7 and FF 2

No worries. We're here to help