www.webdeveloper.com
Results 1 to 6 of 6

Thread: [RESOLVED] CSS classes not displaying at all

Hybrid View

  1. #1
    Join Date
    Mar 2010
    Posts
    3

    resolved [RESOLVED] CSS classes not displaying at all

    Hello all, I am facing a problem and I do not know what to do. The CSS styles I define as classes are not showing up on my browser previews, however, in DreamWeaver they look fine, I have ruled out any human error, I really don't think it's me, is there something I'm missing here?
    This is the Style code that I placed in the HEAD
    Code:
    <style type="text/css">
    
    .960px {
    	width: 960px;
    	margin: 0 auto 0 auto;
    }
    
    .2col { 
    	width: 460px;
    	margin: 0 10px 0 10px;
    	float:left;
    }
    
    
    </style>
    and these are the divs (they are in the body):
    Code:
    	<div class="960px">
    		<div class="2col"> hi </div>
    		<div class="2col">hello </div>
    	</div>
    I have no idea what might be happening! It all seems fine, am I missing a dot somewhere?

    Thank you in advance for your help,
    I really appreciate it

  2. #2
    Join Date
    Mar 2010
    Posts
    3
    PD: I forgot to mention, I have changed the class names like 3 times already, only letters and with numbers and such...

  3. #3
    Join Date
    Mar 2010
    Posts
    2,803
    I don't usually start class or id names with numbers. I don't even know if it's technically allowed.

    I put an 'a' infront of them and all seems to work ok in IE8.

    I put a 1px border around the divs so you can see where they actually are.

    Code:
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style type="text/css">
    .a960px {
         border: 1px solid red;
         
     width: 960px;
     margin: 0 auto 0 auto;
    }
    .a2col { 
         border: 1px solid green;
        
     width: 460px;
     margin: 0 10px 0 10px;
     float:left;
    }
    
    </style>
     
    </head>
    <body>
    <div class="a960px">
      <div class="a2col"> hi </div>
      <div class="a2col">hello </div>
     </div>
    </body>
    </html>

  4. #4
    Join Date
    Mar 2010
    Posts
    2,803
    and if you want hi and hello to appear to be on the one line,

    maybe try this:

    Code:
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style type="text/css">
    .a960px {
         border: 1px solid red;
         
     width: 960px;
     margin: 0 auto 0 auto;
    }
    .a2col { 
         border: 1px solid green;
        
     width: 460px;
     margin: 0 10px 0 10px;
     
    }
    #div1 {
    float:left;
    }
    
    </style>
     
    </head>
    <body>
    <div class="a960px">
      <div class="a2col" id="div1"> hi </div>
      <div class="a2col">hello </div>
     </div>
    </body>
    </html>

  5. #5
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Quote Originally Posted by tirna View Post
    I don't usually start class or id names with numbers. I don't even know if it's technically allowed.
    No, their not: http://www.w3.org/TR/REC-html40/types.html#type-name

  6. #6
    Join Date
    Mar 2010
    Posts
    3
    yes, that was the problem! Dreamweaver does allow the use of numbers first, that is why I could preview it in the program, but when I tried it in firefox or any other browser it did not work because it is not supported.

    Thank you all for your help!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles