CSS & XHTML bugs

[Pokedragonfire]

Okay, ignore all the broken images. (Attached page saved as html file) Can anyone get the text box thing next to the table? More info in attached image. Please don't use a table, use CSS to align it. Thanks :)

 

[Shining Arcanine]

Okay, ignore all the broken images. (Attached page saved as html file) Can anyone get the text box thing next to the table? More info in attached image. Please don't use a table, use CSS to align it. Thanks :)

That isn't well coded and fails to properly seperate presentation from content. I recoded it for you. It took me an hour to do because of 3 reasons:

1. Typing the comments (you'll see when you look at the html/css) took a good deal of time.
2. I went to see a movie before I finshed coding it.
3. I had to troubleshoot why some code didn't work. I found out that I mistakenly used #navbar (I use it on PFU) instead of #nav

I've attached the improved file. It is a bit sloppy (no padding) but it is certainly an improvement.

And no, this doesn't mean that I'm back to stay. I'm here because I wanted to compare something between my forums and another pokemon vBulletin and your thread caught my eye.

 

[Pokedragonfire]

That isn't well coded and fails to properly seperate presentation from content. I recoded it for you. It took me an hour to do because of 3 reasons:

1. Typing the comments (you'll see when you look at the html/css) took a good deal of time.
2. I went to see a movie before I finshed coding it.
3. I had to troubleshoot why some code didn't work. I found out that I mistakenly used #navbar (I use it on PFU) instead of #nav

I've attached the improved file. It is a bit sloppy (no padding) but it is certainly an improvement.

And no, this doesn't mean that I'm back to stay. I'm here because I wanted to compare something between my forums and another pokemon vBulletin and your thread caught my eye.

Wow, thank you! I'm a bit new at (X)HTML and CSS, and can't code well at all yet. (Unfortunatly, a small bit of it I copied but chaged a lot of the copied part, but forgot to add all the quotes and /'s) This is my first webpage with the CSS code and XHTML instead of HTML. I can't see the top banner though, although I know you couldn't either, but I could before. Ahh, you don't have to fix that, you've done enough, and I need learn it better myself. Thanks a lot! You have helped me a lot :) I greatly appreciate it.

 

[Shining Arcanine]

Wow, thank you! I'm a bit new at (X)HTML and CSS, and can't code well at all yet. (Unfortunatly, a small bit of it I copied but chaged a lot of the copied part, but forgot to add all the quotes and /'s) This is my first webpage with the CSS code and XHTML instead of HTML. I can't see the top banner though, although I know you couldn't either, but I could before. Ahh, you don't have to fix that, you've done enough, and I need learn it better myself. Thanks a lot! You have helped me a lot :) I greatly appreciate it.

Your welcome. Also two more things, you'll want to add margin-top: 0; to dl#nav to fix a margin that Firefox adds to dl and add alt attributes (with a short description of the image) to your images so anyone with images turned off knows what the images are about. And as I said in the comments, title attributes are for when you want hover text, not alt attributes (only IE displays alt attributes as hover text and it isn't supposed to). I was showing the HTML to a friend and we came up with those two issues with my revision of your code, sorry about that.

By the way, the top banner is defined in the CSS.

 

[Pokedragonfire]

More problems -_-

I know it is in CSS but for some reason it doesn't appear! I added a bunch of comments in the head. I uploaded it with pictures (not the actual pictures, just some white spaces to fill up the area) If anyone can fix it, I can finally start making the other pages and style sheets! :)
The Page
Image of sort of what it should look like

 

[Shining Arcanine]

I know it is in CSS but for some reason it doesn't appear! I added a bunch of comments in the head. I uploaded it with pictures (not the actual pictures, just some white spaces to fill up the area) If anyone can fix it, I can finally start making the other pages and style sheets! :)
The Page
Image of sort of what it should look like

Try replacing this:

#banner{
background: #000000 url("topbanner.gif"); no-repeat fixed center;
}

With this:

#banner{
background: inherit url(topbanner.gif); no-repeat fixed center;
}

By the way, if you need more room, you will want to adjust the "top" position property in both #content and dl#nav. Additionally, I think I should introduce you to a bunch of validators:

https://validator.w3.org/
https://jigsaw.w3.org/css-validator/

And specifications:

https://www.w3.org/TR/xhtml1/
https://www.w3.org/TR/html4/ - xhtml is based off this; you might need it for reference purposes
https://www.w3.org/TR/CSS1/
https://www.w3.org/TR/CSS21/

The validators should be a huge help.

 

[Pokedragonfire]

Thanks a lot, I will fix it with the validators. The CSS validator says that I have to validate my XHTML code, and I did and fixed everything, then it still said I had to validate my code again. Also, when I tried using the upload CSS file, it can't do HTML and CSS in the same file. And then when I tried putting it in manually, the button did nothing when I hit it. So I can't validate the CSS -_- I don't know what I'm doing wrong.

 

[Shining Arcanine]

There might be a bug in the CSS Validator (I've already encountered one). Try changing this:

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

To this:

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=ISO-8859-1" />

Also, you might want to rearrange your header so that the meta tags are at the bottom of the header. It is just a personal preference but it might be what is messing up the validator.

By the way, you don't have to point the CSS validator to the XHTML page. You can place your CSS in an external file and point the validator at that. You can check my site's XHTML for an example:

https://www.pokemonfanuniverse.com/

 

[Pokedragonfire]

Okay, it works now thanks a lot. I'll fix it myself now :) I am going to link to the CSS and have alternate style sheets, but that will be later, first I have to get the page fixed and running. And make more pages.