Odd CSS problem that I cant exactly put my finger on... (newbie asking for help)

Validate your HTML first.
If it doesn't fix the ordered list problem, come back.
Validation

ok, I'm going to soundd like an idiot here, but how do I validate my HTML? I saw all the errors it brought up, but how do I fix them? They all seemes sort of random me me, it was highlighting all sorts of tags that seemed fine.
stuff like that was being brought up as an error, but just the opening tag/carrot symbol.

Help!?

Remove the br in the unordered list, then fix the following problems, then validate using the W3c validator.

HTML Tidy result
----------------------
http://www.ttfphoto.net/home.html

line 6 column 1 - Warning: missing '>' for end of tag
line 6 column 1 - Warning: element not empty or not closed
line 28 column 1 - Warning: missing

line 28 column 1 - Warning: element not empty or not closed
line 45 column 40 - Warning: unexpected or duplicate quote mark
line 45 column 40 - Warning: attribute with missing trailing quote mark
line 45 column 40 - Error: is not recognized!
line 45 column 40 - Warning: discarding unexpected
line 45 column 93 - Warning: discarding unexpected
line 49 column 1 - Warning:
element not empty or not closed
line 49 column 23 - Warning:
element not empty or not closed
line 50 column 86 - Warning:
element not empty or not closed
line 50 column 90 - Warning:
element not empty or not closed
line 51 column 1 - Warning:
element not empty or not closed
line 52 column 1 - Warning:
element not empty or not closed
line 53 column 1 - Warning:
element not empty or not closed
line 54 column 1 - Warning:
element not empty or not closed
line 55 column 1 - Warning:
element not empty or not closed
line 56 column 1 - Warning:
element not empty or not closed
line 57 column 1 - Warning:
element not empty or not closed
line 58 column 1 - Warning:
element not empty or not closed
line 59 column 1 - Warning:
element not empty or not closed
line 75 column 93 - Warning:
element not empty or not closed
line 7 column 1 - Warning: proprietary attribute "media"
line 28 column 1 - Warning: lacks "alt" attribute
line 71 column 1 - Warning: trimming empty

http://www.csscreator.com/node/8288

ok, I fixed it all, but after each change I loaded the site to see if it made a difference, and every time I changes something to page went "out of wack" so I changed it all back.

Why on earth would you do that? CSS works on VALID code. If your code is invalid then CSS won't work properly.

If you get the HTML valid, then still have problems, then it's a problem with the CSS.

Get it validated and then we'll see what happens.

To explain TPH and DanA's point another way...

When your HTML and/or CSS isn't correct (valid) the browser needs to make guesses as to what you are trying to do. There is no standard way of handling incorrect HTML/CSS, that means the guesses which different browsers make are different.

If your HTML + CSS is valid, then you know all browsers are working to the standard (to the best of their abilities).

ahhhhh, that'll explain it, thanks a lot Chris.

Help!?

using an Xhtml doctype means that you are in essence writing xml code... which always needs every tag that is open to be closed... each
tag in there is invalid, because it's still "open" - in xhtml you have the ability to have "self-closing" tags that would look like this:


that's what you need.

i would also suggest using a loose xhtml 1.0 doctype rather than 1.1, as 1.1 only comes in the "strict" flavor, and can be VERY picky on validation.

this will let a lot more stuff slip by than xhtml 1.1, like target="blank" and other attibutes that are totally invalid in 1.0 strict and 1.1.

also, your stylesheet link isn't closed at all

so that can have a domino effect of whacked-out error messages in validation. however, most of the validator's errors seem to be legit.

No, no, new pages should not be coded to loose, that's naughty and not what it's for, and certainly not for allowing deprecated attributes to slip by target="_blank" is deprecated for a reason and it's better that newbies understand why and code new windows if absolutely required in a better fashion.

XHTML 1.1 can not be used due to the fact that it is reserved for pages actually served correctly as mime type application/ xml+xhtml only 1.0 is permitted to be served as text/html

Alright, I've got it down to 4 "error"s and 2 "info"s but these last few I an't seem to figure out.

1. Error Line 30 column 3: element "il" undefined.

You have used the element named above in your document, but the document type you are using does not define an element of that name.

2. Error Line 36 column 3: document type does not allow element "ol" here; assuming missing "li" start-tag.

3. Error Line 71 column 13: end tag for "li" omitted, but OMITTAG NO was specified.

You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

4. Info Line 36 column 0: start tag was here.

5. Error Line 71 column 13: end tag for "ol" omitted, but OMITTAG NO was specified.

You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

6. # Info Line 29 column 7: start tag was here.

The Current Code:

ttfphoto.net - Home

1. Spotting




2. Portfolio



3. Contact Us



4. About Us



5. Home

Welcome To Through The Fence Photography!

09.19.2006
All Spotting Guides are now online. Website will be finished by the end of the month.

<il> *scratches head* do you maybe mean <li>

This isn't valid either ...

Its


- HTML

- XHTML


that's what you need.

there's still quite a few problems in there, one being the double-ordered list that you've got:

1. Spotting
2. Portfolio
3. Contact Us
4. About Us
5. Home

either take out or close the first

i don't really understand why there's an image in the list item anyway... but clearing that situation up should get rid of a lot of your errors - most of them are caused by the domino effect of an open tag, like i typed before.

the image there is the website banner. www.ttfphoto.net/index.html - the site after the changes
www.ttfphoto.net/contact.html - before the changes
The one with the "valid" code doesn't seem to load in IE.

HTML Tidy result ---------------------- http://www.ttfphoto.net/contact.html 1 error / 39 warnings

HTML Tidy result
----------------------
http://www.ttfphoto.net/index.html

line 1 column 1 - Warning: missing declaration
...

HTML Tidy result
----------------------
http://www.ttfphoto.net/home.html

line 37 column 1 - Warning: missing