Need help? Check out our Support site, then


Change flickr widget layout

  1. I have added the flickr widget in my footer area on the oxygen. I want to have the thumbnails displayed on just one line, horizontally Instead of having them being displayed vertically, one under another.

    I have the custom CSS option and previously succeeded in doing it but the html code of the widget seems to have changed and my CSS code isn't working anymore.
    The code I was using :
    .widget_flickr .flickr-size-thumbnail a {display: inline-block; float: rigth;}
    .widget_flickr .flickr-size-thumbnail img {display: block; float: rigth;}

    The blog I need help with is hendikaf.com.

  2. Note that you do have a typo in your CSS, it should be "right" not "rigth", but even with that fixed it looks like Flickr may have made a change on their side that you need to adjust for.

    Try removing the flickr styles you have in your Appearance → Custom Design → CSS editor and add this instead:

    .widget_flickr #flickr_badge_uber_wrapper {
    	width: 100%;
    }
    .widget_flickr td a {
    	float: left;
    	padding-right: 1em;
    }
    .widget_flickr td br {
    	display: none;
    }
  3. Thank you very much, it works! I've just adapted it a little to better fit with my page width.
    .widget_flickr #flickr_badge_uber_wrapper {<br /> width: 100%;<br /> }</p> <p>.widget_flickr td a {<br /> padding-right: 0;<br /> padding-left: 0;<br /> margin-left: 2em;<br /> font-size: 1.1em;<br /> }</p> <p>.widget_flickr td br {<br /> display: none;<br /> }

Topic Closed

This topic has been closed to new replies.

About this Topic