Support Forum » CSS

My page on IE7 looks wrong

(5 posts)

  1. Mrkus
    Member

    Hello,
    I am a newbie and need some help. I am working on this three column layout template. My site shows fine in FF and Safari.
    In IE7 & Opera text shows up next to the images on either sidebars - how can I fix this?
    I increased the width of the original body margin to compensate for one added div with margins.
    http://masc51.com/brettljause
    Also - when I validate my html it tells me that "target" is not valid and that I need to adjust my css - how do I do that?
    Thank you for your help.
    Markus

    Posted: 2 years #
  2. Cary
    Member

    Style the images with "display:block". This will force the text to flow below the pictures. So you have this styling:

    .thrColElsHdr #container #content_container #sidebar1 .column img, .thrColElsHdr #container #content_container #sidebar2 .column img {
    margin-bottom: 3px;
    margin-top: 3px;
    margin-right: 0px;
    margin-left: 0px;
    }
    .thrColElsHdr #container #content_container #sidebar1 .column img, .thrColElsHdr #container #content_container #sidebar2 .column img {
    border: thin solid #000000;
    }

    You can combine these, add display:block and simplify the selectors because ID's are unique:

    #sidebar1 .column img, #sidebar2 .column img {
    margin: 3px 0; /* 3px top and bottom, 0 on sides */
    border: thin solid #000000;
    display:block;
    }

    Posted: 2 years #
  3. Mrkus
    Member

    Hello Cary,
    Thank you very much for your help.
    I will change my style sheet today - this is really helpful.
    So if I understand correctly (ID's being unique) I really don't need the ".thrColElsHdr" in front of all the #'s. I can just write the individual ID reference and make adjustment from there.
    Markus
    Markus

    Posted: 2 years #
  4. Cary
    Member

    Yes, since ID's are unique there's no way #sidebar1 can be anywhere other than within #content_container which can only be within #container which can't be anywhere else other than within an element with the class of thrColElsHdr.

    If this styling is for several pages you may conceivably have two pages with #sidebar1 but only one of those pages has #sidebar1 contained within #content_container. If you only wanted the styling to work on the page with #content_container then you would need to be more specific and use something like

    #content_container #sidebar1 .column img

    Posted: 2 years #
  5. Mrkus
    Member

    I really appreciate the time you guys put into this forum. I come here often and read your comments, and every time I learn something new. For a newbie like me this is like a life line to the css guru world. Thanks again.

    Posted: 2 years #

RSS feed for this topic

Reply

You must log in to post.

0.056 - 9 queries