Not signed in (Sign In)

Vanilla 1.1.10 is a product of Lussumo. More Information: Documentation, Community Support.

General Support: IE7 Thumbnail Display and Matching Fonts

Bottom of Page

1 to 7 of 7

  1.  
  1.  
    I have just installed a new plogger gallery at brainlessseacreature.dreamhosters.com/photos. Once I reach the thumbnail level when testing in Firefox, everything displays perfectly. In IE7, one of the thumbnails on each row exceeds the size of the main content container. Any thoughts on a fix for this?

    Also, I haven't had luck changing the font family to match the rest of the site. I've commented out all the font family references in the plogger CSS code, assuming that my CSS code will flow through, but that doesn't seem to have made the change. I also tried copying my font-family attributes to all the instances of font-family in the plogger CSS files...also to no avail. Any suggestions.

    Thanks for your help!
    •  
      CommentAuthorkimparsell
    • CommentTimeJul 14th 2008
     
    I just checked your stylesheet, and there is another font-family reference that you did not remove. Look for #wrapper in gallery.css and remove the font-family: declaration there as well. That should change the font in your gallery to what you've declared in your website stylesheet.

    Also, for the overflow issue, change ul.slides to read as follows and see if that solves your problem with IE7:

    ul.slides {
    margin: 15px;
    padding: 0;
    list-style: none;
    line-height: 1.4em;
    width: 95%;
    }
  3.  
    Thanks for your help. The fonts appear correctly now.

    Unfortunately, the alterations to ul.slides doesn't appear to have changed the way the thumbs display in IE7. Only the thumbs are extending beyond the container (the search box and plogger link correctly hug the right side). Photos of IE7 then Firefox displays are below. Any suggestions?

    Correct Display: Firefox
    Firefox

    Incorrect Display: IE7
    IE7
    •  
      CommentAuthorkimparsell
    • CommentTimeJul 14th 2008
     
    I'm glad that the font issue is fixed. :)

    The overflow issue in IE7 is caused by the small sidebar you have to the right, and is actually worse in IE6:

    Your gallery in IE6

    Try commenting out the sidebar code and see if the issue clears up in IE7.

    If the sidebar is only temporary, I'd recommend removing it and adding that information elsewhere on the page.
  5.  
    The issue indeed clears up if I get rid of the sidebar. Ideally, the sidebar will stay, as it will have important content as development continues.

    It's interesting that the search box and the powered by plogger correctly hug the right side of the main content container, while the thumbs don't in IE.

    Does anyone have any suggestions on workarounds for the CSS?
    •  
      CommentAuthorsidtheduck
    • CommentTimeJul 14th 2008
     
    This seems to work, brainless.

    Add the following .layout code to your if IE statement in the header:.layout #mainContent { float: left; margin-right: 0px; }
    .layout #footer { clear: both; }    like so:<!--[if IE]&gt;
    &lt;style type=&quot;text/css&quot;&gt;
    /* place css fixes for all versions of IE in this conditional comment */
    .twoColFixLtHdr #sidebar1 { padding-top: 30px; }
    .twoColFixLtHdr #mainContent { zoom: 1; }
    .layout #mainContent { float: left; margin-right: 0px; }
    .layout #footer { clear: both; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    &lt;/style&gt;
    &lt;![endif]-->

    p.s. What part of Montana were you at? Looks like maybe the Gallatin or the Madison?
  7.  
    Thanks, sidtheduck.

    Looks like it works perfectly!

    The photos were taken around Dillon, MT --- the Beaverhead, Big Hole, and some of the smaller rivers.

1 to 7 of 7

  1.