HTML Help

youthedog4 · Joined: 17 Nov 2009 Posts: 2

I don't know what I did wrong but one of the boxes won't display properly. How can I fix it so each of them are different boxes?
http://youthedog.2x.nu
CSS CODE FOR THIS.
Code: <style type="text/css">
#awesome{
border: 1px solid black;
width: 170px;
background-color: #E6E6E6;
}

#awesome a{
font: bold 13px Verdana;
padding: 1px;
padding-left: 4px;
display: block;
width: 100%;
color: black;
text-decoration: none;
border-bottom: 1px solid black;
}

html>body #awesome a{
width: auto;
}

#awesome a:hover{
background-color: black;
color: white;
}

#tabledescription{
width: 100%;
height: 3em;
padding: 2px;
filter:alpha(opacity=0);
-moz-opacity:0;
}

#
{
border: 1px solid black;
width: 170px;
background-color: #E6E6E6;
}

#coolmenu a{
font: bold 13px Verdana;
padding: 2px;
padding-left: 4px;
display: block;
width: 100%;
color: black;
text-decoration: none;
border-bottom: 1px solid black;
}

html>body #coolmenu a{
width: 50px;
}

#coolmenu a:hover{
background-color: black;
color: white;
}

#tabledescription{
width: 100%;
height: 3em;
padding: 2px;
filter:alpha(opacity=0);
-moz-opacity:0;
}

table{color: white}
H1 { color: red }
A:link {
COLOR: blue /*The color of the link*/
}
A:visited {
COLOR: black /*The color of the visited link*/
}
A:hover {
COLOR: yellow /*The color of the mouseover or 'hover' link*/
}
TD {
FONT-FAMILY: Verdana,Arial,Helvetica /*Properties of items inside of a table*/
}

/*Everything within the BODY tags*/
{
scrollbar-base-color: blue; /*Scrollbar color*/
scrollbar-arrow-color: red; /*Scrollbar arrow color*/
scrollbar-DarkShadow-Color: grey; /*Scrollbar shadow color*/
FONT-FAMILY: Verdana,Arial,Helvetica /*The font properties*/
}

</STYLE>
Table codes.
Code: <div id="coolmenu">
<a href="hangman/hangmangame.html" onMouseover="showtext('Simple little Hangman Game')" onMouseout="hidetext()">Hangman</a>
<a href="russianroulette/russianroulette.html" onMouseover="showtext('Test your luck in this game.')" onMouseout="hidetext()">Russian Roulette</a>
<a href="blackjack/blackjack.html" onMouseover="showtext('Fun little game.')" onMouseout="hidetext()">Blackjack</a>
<a href="http://armorgames.com/" onMouseover="showtext('Hundreds of great games here.')" onMouseout="hidetext()">Amror Games</a>
<a href="http://kongregate.com" onMouseover="showtext('One of the best sites for flash games ever.')" onMouseout="hidetext()">Kongregate</a>
<div id="tabledescription">Games</div>
</div>

<div id="awesome">
<a href="coppermine/index.php" onMouseover="showtext('Simple little Hangman Game')" onMouseout="hidetext()">My Artwork</a>
<a href="http://youtube.com/" onMouseover="showtext('Find videos on alnmost ANYTHING here.')" onMouseout="hidetext()"><img src="youtube_logo_31_Dec_06.jpg">Youtube</a>
<div id="tabledescription">Media</div>
</div>

PayneLess Designs · Joined: 28 Feb 2007 Posts: 4227 Location: MS

Some questions. What is these for?
Code:
/* Can't just use "#" */
#
{
border: 1px solid black;
width: 170px;
background-color: #E6E6E6;
}

/* Scroll colors work IE only. No selector name */
/*Everything within the BODY tags*/
{
scrollbar-base-color: blue; /*Scrollbar color*/
scrollbar-arrow-color: red; /*Scrollbar arrow color*/
scrollbar-DarkShadow-Color: grey; /*Scrollbar shadow color*/
FONT-FAMILY: Verdana,Arial,Helvetica /*The font properties*/
}

/* TWO Listed */
#tabledescription {
width: 100%;
height: 3em;
padding: 2px;
filter: alpha(opacity=0);
-moz-opacity: 0;
}

Which box are you having problems with?

CSS ERRORS

HTML Errors

Need to remove these from within the HTML tags: Quote: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

This one has to be moved to the very TOP of your page: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Sticks gave some good advice here for your similar post.