SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Wizard Keriam's Avatar
    Join Date
    Jun 2003
    Location
    Colorado, USA
    Posts
    1,178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS and HTML validation issue

    I have just finished converting one of my sites to CSS. Everything is finally working just the way I want it to and the CSS validates. However, the HTML does not and it seems to be related to the CSS.

    I am using SSI for the header and footers. I have two div's defined that I use frequently. The first I have called #container and it is designed to confine everything else to a specific width in the presentation. The other, #text, sets all the formatting for the textual content on the page.

    The W3C validator yells at me for multiple uses of the same div names. In other words, because #container appears in the header, body and footer there are three instances of it and it tells me on the latter two that the div is already defined. Same thing goes for #text. As a result, I can not even get the page to validate as 4.01 transitional.

    Am I going to have to define seperate #container for header and footer and so on? Thats seem counter productive and not in the spirit of CSS.

  2. #2
    SitePoint Guru bronze trophy blufive's Avatar
    Join Date
    Mar 2002
    Location
    Manchester, UK
    Posts
    853
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I assume you mean you have something like this:
    HTML Code:
    <html>
      <head>
    ...
    <style type="text/css">
    #container { blah blah }
    </style>
    ...
    </head>
    <body>
    ...
    <div id="container">...</div>
    ...
    <div id="container">...</div>
    ...
    </body>
    </html>
    The problem is that an id is supposed to be a unique identifier. There's only supposed to be one [thing] with a particular id in any one page. This carries over into the DOM, and methods like getElementById()

    If you want more than one of them, use classes instead:
    HTML Code:
    <html>
      <head>
    ...
    <style type="text/css">
    [color=red].[/color]container { blah blah }
    </style>
    ...
    </head>
    <body>
    ...
    <div [color=red]class[/color]="container">...</div>
    ...
    <div [color=red]class[/color]="container">...</div>
    ...
    </body>
    </html>

  3. #3
    SitePoint Wizard Keriam's Avatar
    Join Date
    Jun 2003
    Location
    Colorado, USA
    Posts
    1,178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ahhhh, I see now!

    I guess I still do not have my brain wrapped completely around this CSS stuff yet but I am getting there

    Thanks!


Bookmarks

Posting Permissions

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