[stud3nt3]

Chrome and Firefox aren't styling any of the span elements I have-in IE they load fine. For example the css..I'll check back in this book I have and online to see if I can find the issue. I appreciate any help. For example heres a span I have.

.title {background-color:CCCCCC;
        font-family:Verdana;
	 margin:0px;
	 padding:0px;
	 border:2px double blue;
	 height:70px;
         width:200px;
}

the html..

<div id="menu">
     <span class="button">
       <a href="www.google.com">home</a>
     </span>
      <span class="button">
       <a href="www.google.com">home</a>
     </span>
      </div>
     <div id="content">
       <div id="sidebar">
         <p>sidebar to the right</p>
         <h2>text</h2>
         </div>
     <span class="title">
     <h2>Title of something</h2>
     </span>
         <p>some text sdfdsdsfdsf</p>
    </div>

It may be that the divs and spans are conflicting because of their properties or that they are not properly nested or named..?
Here's my whole css document.

#container {margin-left:25%;
           margin-right:25%;
}
#header {text-align:center;
        background-color:grey;
		border:solid; 
		border-width:2px;
		border-color:black;
		margin-bottom:20px;
}
#menu {background-color:white;
      border:solid;
	  border-color:black;
	  border-width:1px;
	  font-family:Verdana;
	  padding:8px;
	  margin:0px;
	  
}
.button {background-color:#FFFFCC;
         margin:3px;
		 width:90px;
		 border:solid;
		 padding:2px;
		 border-width:1px;
		 border-color:black;
		 text-decoration:none;
		 color:grey;
		 text-align:center;
		 font-family:Verdana;
		 font-size:small;
}
#content{background-color:white;
         font-family:Verdana;
		 padding-left:20px;
		 padding-top:0px;
		 padding-bottom:0px;
		 border:1px solid grey;
		 margin-right:0px;
		 margin-top:20px;
		 height:900px;
}

.title {background-color:#CCCCCC;
        font-family:Verdana;
	    border:2px double #000000;
	    height:70px;
		width:200px;
}

#footer{align:center; background-color:grey;font-size:.60em;}
#sidebar {float:right;
         width:150px; 
		 height:900px;
		 background-color:white;
		 border-left:1px double grey;
		 margin-left:0px;
		 padding:8px;
}

[Akh]

Chrome and Firefox is doing the what the specification says, width and height is ignored.

http://www.w3.org/TR/CSS21/visudet.html#inline-width
http://www.w3.org/TR/CSS21/visudet.h...e-non-replaced

You can use the display property to change the behaviour of the span elements.

[Kravvitz]

Welcome to DevShed Forums, stud3nt3.

To add to what Akh said, an <h2> may not be placed within a <span> (or other inline elements, including <a>s). Just give the class to the <h2> directly.