I'm trying to work on a project for my authoring for the web project. We have an index XHTML file that we are modifying through the use of CSS. I'm having a really rough time of it, but there is a way that you can help out.
once you are there, click on the CSSZen link and it will take you to the project that I'm working on. On the project's page you can look at the "The CSS" link to see what I've done so far.
It's killing me trying to get my menu in a horizontal line across the top with the background images.
Any help would be welcome.
P.S. This isn't spam, and I'm getting really sick of people whistling on my non-spam.
Posted by Boris (Member # 6935) on :
First tip, add this to your CSS...
ul{ list-style-type:none; }
This will get rid of the bullets, which is a big part of what is messing up your alignment. I'm having to remember some of this stuff by redoing some old research on CSS, so try this and we'll work from there If you want bullets, I'll need to dig a little.
edit: Gotta tell you. Pick a new background image, or do without one (I prefer the latter, the page looks better without it, actually). A 3MB image file is a *BAD* web design background choice. Further, it's ugly and clashes, making the page hard as heck to look at, much less read through.
Posted by fugu13 (Member # 2859) on :
Before that, even, correct your XHTML validation errors. There are some big ones.
The problem is that we started out with a different index page. Then the professor supplied us with a new index file with added tags and such. So while it looked good on the original, when I attached the style sheet to the new it's been a nightmare to clean up.
Posted by Philosofickle (Member # 10993) on :
This is the original background color, as you can see it rounds out the corners of the banner.
edit- Would it work to change the h2 tags hidden and then insert graphics for the topic headings?
edit again- the gaps in the top menu are driving me crazy!
Posted by fugu13 (Member # 2859) on :
The page is badly malformed. If your professor provided the source for the page as we see it now, he's badly incompetent, unless you're also supposed to fix that (which you should).
From there, read the list apart article. You can get where you want to go very quickly by starting from one of the examples.
Posted by Philosofickle (Member # 10993) on :
He's not so much incompetent as I am.
You can check out his two versions of our assignment at
then check out his CSS Zen pages. With the vertical and the horizontal menus.
We both had the same source pages, I just suck.
Posted by fugu13 (Member # 2859) on :
Okay, the page he provided is actually slightly different, and only has two big (but stupid) errors on it. One is probably laziness (no character encoding), and one is fumbly fingers, most likely (no closing head tag). He should have validated.
Your page has somewhat different HTML, and one additional big error. Take a look at the a tag you added in one of the menu items. Or just run it through the validator.
AFTER you have fixed all the html errors, go read the a list apart article. Learn from it. Start by applying the CSS from one of their inline examples to your page, adapting as necessary, and then slowly modify it.
Posted by Scott R (Member # 567) on :
Fugu is wise.
Posted by Philosofickle (Member # 10993) on :
Well, my class starts in half an hour so right now I'm going by the "if it's not <i>too</i> broke, don't bother fixing it."
I'd really like to try to clean up the code, but what's killing me right now is the gaps in the menu.
Posted by ladyday (Member # 1069) on :
I'm going to weigh in with another /agree fugu.
Posted by Philosofickle (Member # 10993) on :
I feel really stupid now for not following your advice earlier.
All I did was hit the clean up XHTML command and it's good. Why do I not listen?
![[Big Grin]](biggrin.gif)
If you want bullets, I'll need to dig a little.![[Wall Bash]](graemlins/wallbash.gif)
Why do I not listen?