WordPress.org

Forums

XHTML Strict!! (very excited) but mysterious css border (10 posts)

  1. vetto
    Member
    Posted 9 years ago #

    http://www.themainbrace.com

    O.K. Finally got a xhtml strict site that I love working, and am hacking away at the CSS (some in header, most linked). Look at the buttons on the main page lower right and see if anyone can figure out why the href is causing a border! What am I missing?

    [a name="foo"] causes no border so it is not the "a", right? but as soon as the [a href] goes in, BOOM nasty border.

  2. Beel
    Member
    Posted 9 years ago #

    .buttonlist img {border:none}

  3. estjohn
    Member
    Posted 9 years ago #

    img style="border: 0;" needs to be added

    you have that on some of the images in the buttons like get firefox but not the ones with borders
    oops I was editing my post and didnt see the one above me till after i posted.

  4. vetto
    Member
    Posted 9 years ago #

    BTW, please post what Browser and on what platform you are using. I use FF on Linux, and it looks slightly different than FF on WinXP. (Very odd)

    It does not have to look the "same", only presentable. One day all the browsers will display a validated site the same (I dream about that)

  5. vetto
    Member
    Posted 9 years ago #

    The sidebar is an ID called "sidebar" in the stylesheet, and there I have

    #sidebar .buttonlist { border: 0;}
    #sidebar .buttonlist a { border: none;}

    and in the "a" element itself in the sidebar I explicitly specified
    style="border: none;" to no avail.

  6. estjohn
    Member
    Posted 9 years ago #

    ok in the source you have

    <p id="firefoxlink" style="text-align: center; border: 0;"><a href="http://spreadfirefox.com/community/?q=affiliates&amp;id=2490&amp;t=1" title="WordPress recommends the open-source Firefox browser"><img style="border: 0;" src="http://www.themainbrace.com/blog/wp-images/getfirefox.png" alt="Get Firefox" /></a>

    and on the second one you have
    <a href="http://www.getfirefox.com"><img src="http://www.themainbrace.com/blog/wp-images/firefox0.png" width="80" height="15" alt="a standards complient browser" /></a>

    the one that has the border does not have the style border=0 in the link.

  7. vetto
    Member
    Posted 9 years ago #

    Beel, thanks...that did it. Why were the other img's in the class not displaying a border, and only the ones with a link were?

  8. vetto
    Member
    Posted 9 years ago #

    estjohn, that first ID of "firefoxlink" only shows up in non-complient browsers (read: ie)
    So if you are using FF you dont see that displayed. If you are using IE, then you get that link and the one in the button bar. :)

  9. estjohn
    Member
    Posted 9 years ago #

    ok.. but are you trying to get it with no border and to look the same in all browsers?

    I had to do it by using border: none; in my style.css

    I was just trying to exaplin why the ones that had them did..

    I understand it is different for all browsers.. I have flock, opera, ie, ff, mozilla, netscape in windows. what also looks the same in windows can look even more differnt in linux or on the mac too.. so i try to check with all

  10. vetto
    Member
    Posted 9 years ago #

    Thanks, I dont even have IE here at home normally so I dont see the first Get Firefox logo (that is from the pimpfirefox function in the wp-admin page. Look at the bottom of the manage page in IE.)

    I am installing XP in a virtual machine to view the page in IE.

Topic Closed

This topic has been closed to new replies.

About this Topic