SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Addict
    Join Date
    Mar 2002
    Location
    Los Angeles
    Posts
    325
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    help with style sheets...should be simple

    hey...

    I have all the docs in my site linking to a style sheet. Here is what I have in the style sheet:

    body {
    background-color : #FFFFFF;
    font-family : Arial, Helvetica, sans-serif;
    font-size : xx-large;
    color : Black;
    }
    .boldText{
    font-family : Arial, Helvetica, sans-serif;
    font-weight : bold;
    }
    a:link{
    text-decoration : none;
    }
    a:hover{
    text-decoration : underline;
    }
    a:visited{
    text-decoration : none;
    }
    a:active{
    text-decoration : none;
    }

    but the only thing that is working on the page is where i have <p class = "boldText" >.

    I have the font set to something large just to see if its reading it right.
    From here on, it's instinctual...even straight roads meander.

  2. #2
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Re: help with style sheets...should be simple

    Originally posted by Roadie
    but the only thing that is working on the page
    So what part isn't working? the link definitions? the BODY text size? what?

  3. #3
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I copied your stylesheet and used this chunk of code to test with:

    This is normal body text
    <br><br>
    <a href="">This is a link</a>
    <br><br>
    <span class="boldText">This is bold text</span>

    It all appeared to work for me. How are you linking to the stylesheet? Like Andrew said, how is it "not working"?
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  4. #4
    SitePoint Addict
    Join Date
    Mar 2002
    Location
    Los Angeles
    Posts
    325
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok, sorry let me be more clear. The .boldText class is working fine. Its the body text, no matter what i set it to it is always setting to default text (which looks like 12-pt Arial). The way I am seeing it, any text on the page that is defined by the "boldText" class should fall under the "body" tag, and therefore be huge, according to what i have specified in the style sheet.

    I am wondering, do I actually have to redifine the <p > tag in the style sheet, since all the text on the pages falls between them?

    oh yeah, the link thing is another matter, i can't seem to get that to work either (man i am a mess, huh?). All i want to do is have all the links on the page get underlined when hovered over. and I always want the links to be #FF9900, even the visited links.

    Thanks for your help.
    From here on, it's instinctual...even straight roads meander.

  5. #5
    SitePoint Wizard Aes's Avatar
    Join Date
    Jun 2001
    Location
    Oklahoma
    Posts
    3,392
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I always encapsulate the text on my pages with paragraph tags <p></p>; I do not like to rely on the body tag for this exact reason. Try this:
    Code:
    <style type="text/css">
    <!--
    body{
         background-color : #ffffff ;
         font-family : Arial, Helvetica, sans-serif ;
         font-size : xx-large ;
         color : Black ;
    }
    p{
         font-family : arial, helvetica, sans-serif ;
         font-size : 30px ;
         color : #0000ff ;
    }
    .boldText{
         font-family : Arial, Helvetica, sans-serif ;
         font-weight : bold ;
    }
    a{
         text-decoration : none ;
         color : #ff9900 ;
    }
    :hover{
         text-decoration : underline ;
    }
    :active{
         text-decoration : none ;
    }
    :visited{
         text-decoration : none ;
    }
    -->
    </style>
    And then surround the text with <p></p> and see if that makes any difference.

    Additionally, I would recommend limiting your use of "global" classes. Always use a selector in my opinion (e.g. instead of .boldText, use p.boldText). That of course limits the use of style="boldText" to the <p> tag, however, it seems to be far more reliable.

    -Colin
    Colin Anderson
    Ambition is a poor excuse for those without
    sense enough to be lazy.

  6. #6
    SitePoint Addict
    Join Date
    Mar 2002
    Location
    Los Angeles
    Posts
    325
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeah, thank you, i actually did wind up not using the "global" classes:

    body {
    background-color : #FFFFFF;
    font-family : Arial, Helvetica, sans-serif;
    font-size : 10pt;
    color : Black;
    }
    p {
    font-family : Arial, Helvetica, sans-serif;
    font-size : 10pt;
    }
    p.head {
    font-family : Arial, Helvetica, sans-serif;
    font-size : larger;
    color : #FF9900;
    }
    p.orangeSub{
    font-family : Arial, Helvetica, sans-serif;
    font-size : 10pt;
    font-style : italic;
    font-weight : bold;
    color : #FF9900;
    }
    p.boldText{
    font-family : Arial, Helvetica, sans-serif;
    font-weight : bold;
    font-size: 10pt;
    }

    i was going to ask about setting the font size to an exact point size, but i see that you had done that yourself, so i guess its good to go.

    as far as the links go, i havent actually gotten to messing with them, but i was just reading a post where someone had comma seperated the a:, a:active, and a:visited styles to keep it all on one line, is this possible?
    From here on, it's instinctual...even straight roads meander.

  7. #7
    SitePoint Addict
    Join Date
    Mar 2002
    Location
    Los Angeles
    Posts
    325
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    AES:

    the code for the links wouldnt work, i am not getting the underline when i hover.
    From here on, it's instinctual...even straight roads meander.

  8. #8
    SitePoint Addict
    Join Date
    Mar 2002
    Location
    Los Angeles
    Posts
    325
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok, get this, i was reading in a different post that hover should be the last thing defined, so I canged it around and your code worked fine.


    Thanks again for your help.
    From here on, it's instinctual...even straight roads meander.

  9. #9
    SitePoint Wizard Aes's Avatar
    Join Date
    Jun 2001
    Location
    Oklahoma
    Posts
    3,392
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Roadie
    AES:

    the code for the links wouldnt work, i am not getting the underline when i hover.
    Originally posted by Roadie
    ok, get this, i was reading in a different post that hover should be the last thing defined, so I canged it around and your code worked fine. ...
    Yes, I too have heard that order has something to do with it, though in all my experience, order has had nothing to do with it. The order I gave you works on all browsers on my site.... That's odd.

    -Colin
    Colin Anderson
    Ambition is a poor excuse for those without
    sense enough to be lazy.

  10. #10
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Roadie...

    What browser are you using? That might have somehting to do with your difficulties.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  11. #11
    SitePoint Addict
    Join Date
    Mar 2002
    Location
    Los Angeles
    Posts
    325
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    AES - yeah, it sounds strange, but everything works fine now.

    I am using IE 5.5 on W2K.

    I havent tested it in netscape yet, so i'm crossing my fingers.
    From here on, it's instinctual...even straight roads meander.

  12. #12
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Tip to avoid inheritence problems:

    Place a generic do-it-all chunk of CSS at the beginning which caters for all containter items, but miss out the font-size:

    BODY, DIV, SPAN, TD, TH, BLOCKQUOTE {
    font-family:verdana, arial, helvetica, sans-serif;
    color:#000066
    }

    This usually does the trick for me. Actually, it's never failed - the trick is not to put too much in that selector - for example, background colours.
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback


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
  •