Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5

Thread: Need CSS Help

  1. #1
    New Coder
    Join Date
    Aug 2002
    Location
    Jacksonville, NC
    Posts
    48
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Need CSS Help

    Hi all,

    What is the difference between
    <p id=#347>Text</p>
    and
    <p class=347>Text</p>
    Genius has to have a starting point

  • #2
    Senior Coder
    Join Date
    Jul 2002
    Posts
    1,628
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i cut and pasted from this website, you should read more about it:
    http://www.w3schools.com/css/css_syntax.asp

    if you are using just a stylesheet to identify custom elements
    just use class=""




    .center {text-align: center}

    In the code below both the h1 element and the p element have class="center". This means that both elements will follow the rules in the ".center" selector:

    <h1 class="center">
    This heading will be center-aligned
    </h1>
    <p class="center">
    This paragraph will also be center-aligned.
    </p>



    --------------------------------------------------------------------------------

    The id Attribute
    The id attribute can be defined in two ways. It can be defined to match all HTML elements with a particular id, or to match only one HTML element with a particular id.

    <p id="intro">
    This paragraph will be right-aligned.
    </p>


    In this example the id attribute will match all HTML elements with id="intro":

    #intro
    {
    font-size:110%;
    font-weight:bold;
    color:#0000ff;
    background-color:transparent
    }


    In this example the id attribute will match only p elements with id="intro":

    p#intro
    {
    font-size:110%;
    font-weight:bold;
    color:#0000ff;
    background-color:transparent
    }

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    NL
    Posts
    421
    Thanks
    0
    Thanked 0 Times in 0 Posts
    #347

    Also, id selectors should not start with a number.

  • #4
    New Coder
    Join Date
    Nov 2002
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It is hard to understand the difference between using an ID as opposed to class. Some clearer explanations of a complex subject are at:

    * http://css-discuss.incutio.com/?page=ClassesVsIds
    * http://archives.hwg.org/hwg-techniques/002801c07a47$7dab0300$8400a8c0@WORKGROUP

    However, I think the best explanation I've read comes from http://www.brainjar.com/css/using/default2.asp and says:
    Class vs. ID
    The ID attribute of an HTML tag is intended solely to provide a unique identifier. The CLASS attribute, however, was specifically designed to allow authors to assign styles to elements.

    Strictly speaking, no two elements within a document (web page) can have the same ID. Anytime you add an ID attribute to a tag, its value should be different from that of any other element's ID on the page, even if they have different tag names. So a style rule with an ID selector can, at most, only apply to a single element on a page.

    So why not just use an inline style instead of an ID selector in a style sheet? Well, you'll probably find it more convenient to keep all your style definitions in one place, rather than scattered throughout the document. And, if the style sheet is external, it can be shared by multiple pages.

    Note that if you do specify a tag name on a ID selector (e.g., h1#mainTitle instead of #mainTitle) the tag name and ID must match the element in order for the style to be applied.
    The class selector, on the other hand, can match several elements on a page, even elements with different tag names. And, a tag can have more than one class (by specifying a list of class names separated by spaces). For example, given the following rules and HTML

    h3.warning { color: red }
    .highlight { background-color: yellow }

    ...

    <h3 class="warning highlight">Danger</h3>

    <h4 class="warning highlight">Proceed with Caution</h4>
    The H3 tag would appear in red text, but the H4 tag would not. Both would have a yellow background however.
    Hope this helps.

    Neil

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    41° 8' 52" N -95° 53' 31" W
    Posts
    3,660
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ...and that is absolutely correct. If you use id instead of class in more than one spot, then when you try to validate your XHTML you will find to your dismay that the validator tells you exactly what brainjar's site does.
    Former ASP Forum Moderator - I'm back!

    If you can teach yourself how to learn, you can learn anything. ;)


  •  

    Posting Permissions

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