Page is a not externally linkable
- Code, Content, and Presentation
-- CSS
---- CSS 2 Level Horizontal Nav problem


appi2 - 12:42 am on Jul 4, 2008 (gmt 0)


Ok I shall take that back, I missed the 12:50 pm on July 2 post and only read the two below.
I did actually bother to load the code, but as soon as I saw no CSS and a white page with bits of text due to my pet hate, background images/images in examples, well it was time for a little rant.

The background image/image thing, lots of people post code with images, now sometimes we can work out problems without even loading the code examples. But if we do look at the code we can't see the images. So we have to add our own or apply a background colour, to try and help to see whats happening or what they are trying to do. Sometimes I just add a border to everything (*{border:1px solid red}). But if it becomes too much effort, then I'll pass.

Anyhoo, centering. To center page content, you have to apply a width to the container/outer div your trying to center.

eg.
<style type="text/css">
#page {width:800px;margin:0 auto; text-align:center; border:2px solid red;}
</style>
</head>

<body>
<div id="page">
<h1>ulllooo</h1>
</div>

Now if you have floated elements inside that <div id="page">...</div> and the total width of those elements are wider than the width you specify in the #page the the floats are going to wrap. You've also got to be aware of what happens when someone increases font size. You should use em instead of px to help.

Browser differences, When you testing have every browser you can find open and look at the differences. Eventually you can know what to expect.

If you get some weird problem and some part of your design doesn't work. Take that part of the design and load it into its own page and check. You then get to know whether, its CSS specifity or another part of your design thats causing the problem. Break things down and build back up.

Pretty box's around code examples on the forum. Yeah takes a while to work out ;) Cheat use quote...quote or even quote pre ... pre quote with the []s.

And finally, any new problems, its probably best to post in a new thread specific to the problem. The title of this thread no longer has anything to do with what your doing. And won't help anyone searching for info on spry horizontal menu.


Thread source:: http://www.webmasterworld.com/css/3681555.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com