WordPress.org

Support

Support » How-To and Troubleshooting » Nggallery thumbnails width

Nggallery thumbnails width

  • I can`t seem to find the right css lines to change to get the thumbnails spanding to the width of my pages ( 655 now)

Viewing 5 replies - 1 through 5 (of 5 total)
  • It`s not the thumbnails itself I mean but the whole gallery.
    I want it aligned with the page width. The rest of the page has from left border to text 5 px. How can I get the album to do the same?
    And to spand over the width of the page.

    I tried to change all of nggallery css, but no luck…

    I`ve tried modifiyng these but nothing changes?????????

    .ngg-gallery-thumbnail img {
    background-color:#FFFFFF;
    border:1px solid #333333;
    display:block;
    margin:4px 0px 4px 5px;
    padding:0px;
    position:relative;
    }

    .ngg-gallery-thumbnail img:hover {
    background-color: #A9A9A9;
    border:1px solid #999999;

    This is all all the style.
    I can`t get the thumbs to span so that the gallery will be the same width as the rest of the oage. About 650 px

    /* ----------- Gallery style -------------*/
    
    .ngg-galleryoverview {
    	overflow: hidden;
    	margin-top: 10px;
    	width: 100%;
    	clear:both;
    	display:block !important;
    }
    
    .ngg-galleryoverview .desc {
    /* required for description */
       margin:10px 10px 10px 0px;
       padding:0px;
    }
    
    .ngg-gallery-thumbnail-box {
    	float: left;
    }
    
    .ngg-gallery-thumbnail {
    	float: left;
    	margin-right: 10px;
    	text-align: left;
    }
    
    .ngg-gallery-thumbnail img {
    	background-color:#FFFFFF;
    	border:1px solid #333333;
    	display:block;
    	margin:4px 4px 4px 30px;
    	padding:0px;
    	position:relative;
    }
    
    .ngg-gallery-thumbnail img:hover {
    	background-color: #A9A9A9;
    border:1px solid #999999;
    
    } 
    
    .ngg-gallery-thumbnail span {
    	/* Images description */
    	font-size:90%;
    	padding-left:0px;
    	display:block;
    }
    
    .ngg-clear {
    	clear: both;
    }

    The key to this is the “width” command in ngg-galleryoverview. Set it to 110% for example, and you get the freedom to extend the width of your gallery outside of the column. This is necessary because the margin-right of 10px on the last thumbnail else prevents it from aligning to your column width.

    Hope this helps

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Nggallery thumbnails width’ is closed to new replies.