SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist
    Join Date
    Mar 2011
    Posts
    423
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Black and red text should be white!

    Hi,

    I am using this CSS:


    .basket-details {
    background: url("../buy.png") no-repeat scroll -3960px 0 #3A3A3A;
    clear: both;
    color: #FFFFFF;
    letter-spacing: -0.02em;
    line-height: .6;
    margin: 0 0 15px;
    padding: 12px 12 12px 12px;
    }

    .basket-details th.description{
    width: 237px;
    }

    .basket-details th.price{
    width: 72px;
    }

    If I use this:

    <th class="description">Description</th>
    <th class="description">Code</th>
    <th class="price">Quantity</th>
    <th class="price">Price</th>

    the "description" coded words (Description and Code) are black. And the "price" coded words (Quantity and Price) are red. I want them to all be white! What is wrong?

    Matt.

  2. #2
    SitePoint Evangelist
    Join Date
    Jun 2007
    Location
    North Yorkshire, UK
    Posts
    483
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To start with you have not told us were the class basket-details fits into the html.

    It is not possible to advise further without a fuller picture of the css or the html. Can you post a URL?

    Usually these problems result from a different styling selector being applied to the one that you are expecting. The trick then is to understand why and correct the css appropriately.

    For example if you have styles

    .basket_details th {
    color: white;
    }

    #content th {
    color: red;
    }

    you might find that the text in th cell is coloured red rather than white. You might think otherwise but the browser might assume the other is more specific and thus appropriate.

  3. #3
    SitePoint Addict EarlyOut's Avatar
    Join Date
    Mar 2011
    Location
    Sector R
    Posts
    280
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    BTW, this is the kind of problem for which Firebug is a real time-saver. You can pull up your page, ask Firebug to examine "Description," and it will show you what CSS is being applied to it. Much easier than hunting through the code to find the culprit!


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
  •