CSS hyperlink styling issue

  • invaderj

    (@invaderj)


    21 years, 3 months ago

    Hi everyone,

    I setup a site at http://bitchlog.com, using the lindkvist-desk theme by Lindkvist/Heilemann.

    I’m having a problem with the text style of the links in the content. I’m using Safari and Firefox browsers on OS X (latest versions of both) and have not tested this much yet on the PC side, for now I want to fix it for the Mac browsers.

    Anyway, if you look at the links in unstyled content the links are fine (eg. the link to ‘AMC Empire’ and ‘MovieTickets.com’) BUT the links in ITALICIZED content remain normal.

    Obviously I’d like links that appear inside of stylized text to appear stylized.

    I’ve researched this a bit and I had thought that the addition of ‘text-decoration: none’ to the anchor entry in the CSS file would do the trick, but that did not work. I’ve tried to also add that to other CSS entries that looks like they’re governing the content but that did not work either.

    I’m a real CSS noob so I’d love it if someone could give me some insight as to why my links aren’t getting styles applied to them.

    The site is at http://www.bitchlog.com
    The CSS is at http://www.bitchlog.com/style.css
    And I’ve uploaded a TXT copy of the PHP index at http://www.bitchlog.com/index.txt

    Many thanks in advance!

    *justin

Viewing 8 replies - 1 through 8 (of 8 total)
  • Mark (podz)

    (@podz)

    21 years, 3 months ago

    I would create a class for blocks like that if they will be used with some frequency:

    .ital {
    font-style: italic
    }

    <div class="ital">Note: AMC’s Empire 25 theater.........</div>
    That should over-ride the <a tag not wanting to play ball with the current tag method you have.

    Thread Starter invaderj

    (@invaderj)

    21 years, 3 months ago

    Hi Podz,

    Thanks *very* much for the help. I added an .ital class in the CSS, and added the appropriate div tags in the entry. Unfortunately that did not work. (actually, the same problem can be seen further down the content within that blockquote content area – the content is italicized but the link is not.)

    This is proving to be quite an annoying little problem. =)

    (also, the changes that Podz mentioned are currently in use at the above URIs if anyone would care to have a look…)

    Mark (podz)

    (@podz)

    21 years, 3 months ago

    You could try
    .ital p {
    font-style: italic
    }

    The Webdev bar I use to manipulate plays up with your layout for come reason – not your fault just mentioning it.

    Thread Starter invaderj

    (@invaderj)

    21 years, 3 months ago

    Hmm. I changed the CSS class to include the p, and moved the <p> tags around the content to compensate… Unfortunately, no luck!

    sadish

    (@sadish)

    21 years, 3 months ago

    have you tried this ?

    . ital a {
    font-style:italic;
    }

    Thread Starter invaderj

    (@invaderj)

    21 years, 3 months ago

    Ha! Thanks sadish and podz – I put both bits of code in my sheet and now it works great.

    Somewhat related question: I have this style setup for anything I apply the <blockquote> tag to:

    blockquote
    {
    margin: 5px 5px 20px;
    padding: 0 0 0 15px;
    background: url("images/blockquote.gif") no-repeat top left;
    font: italic 100%/130% Georgia, "Times New Roman", Serif;
    }

    The problem is similar – the text looks great, but the links are not italicized. Can anyone recommend something to try?

    Thanks as always!

    TechGnome

    (@techgnome)

    21 years, 3 months ago

    Try this:

    blockquote a {
    font-style:italic;
    }

    That will tell it to italics any link in a blockquote….

    OK, I’ve thought it over a bit, and I’m wondering if some style are being stepped on. Time for a little CSS 101.

    On second thought, I’m going to put this into a new posting.

    Be back later with it.

    Tg

    Thread Starter invaderj

    (@invaderj)

    21 years, 3 months ago

    Tg,

    That fixed it right up, looks great!

    Thanks to all of you for your help! It’s great to see such helpful folks. =)

    *justin

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘CSS hyperlink styling issue’ is closed to new replies.