Not signed in (Sign In)

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

  1.  
    Hi,
    I'm really excited to be using Plogger - great product!

    I'm working with the Default Theme and dropping it into my site's local CSS. I'm running into a few display issues on the Albums page where the thumbnails seem to be extending outside of the thumbnail container in Internet Explorer. I've edited the gallery.css file to fit the gallery within my site's main content area, but it seems like I might have messed something up. In IE, the album thumbnails are not wrapping properly after my right menu ends. In Firefox, there seems to be a blank spot in the middle of the thumbnails where an album thumbnail should be (although, the thumbails are wrapping correctly in both Firefox and Safari).

    Here's the page:
    http://www.lib.colum.edu/plogger/index.php?level=collection&id=3

    Would somebody mind giving it a look to see if this is a simple error in my gallery.css file? I'm not sure what I'm missing.

    Thanks for your help!
  2.  
    Ok, I figured out the thumbnail container issue, but I still have a strange space appearing in my list of Albums on the collection page mentioned above.

    I beleive that the space is referencing an album I previously deleted from the collection. Any idea why there would be a space where a deleted album used to be?
    •  
      CommentAuthorkimparsell
    • CommentTimeJan 14th 2009
     
    This isn't an issue with a deleted album, but a css issue. The title for the album Christopher Wiersema (5 pictures) extends to 3 lines (the other album titles are only 2 lines), so the next row isn't aligning properly. Open your stylesheet (gallery.css) and make the following changes:

    1. Find .thumbnail img and .thumbnail a:hover img and replace with the following code:
    .thumbnail img {
    padding: 5px;
    text-align: center;
    margin: 10px 3px;
    background: #fff;
    border-width: 1px;
    border-color: #789;
    }

    .thumbnail a:hover img {
    border-width: 2px;
    border-color: #38c;
    margin: 9px 2px;
    }

    2. Find ul.slides and .slides li and replace with the code below:
    ul.slides {
    margin: 0 auto;
    margin-top: 15px;
    padding: 0;
    list-style: none;
    line-height: 1.4em;
    }

    .slides li {
    display: block;
    float: left;
    margin: 0 10px 10px 0;
    padding: 0;
    width: 130px;
    height: 185px;
    }

    3. To fix issues with your collection/album titles not wrapping properly, find .tag and replace with the code below:
    .tag {
    text-align: center;
    width: 130px;
    line-height: 1.2em;
    }

    The key was changing the margin and padding in a few places, and declaring a set width and height on .slides li instead of auto.
    Thankful People: pandianbe, kwillette@colum.edu
  3.  
    That did the trick. Thanks so much for your help!