The Support Forums will be in read-only mode for a scheduled maintenance window on 01 September 2016 14:00 UTC - 20:00 UTC. More information.

Need help lining images up side by side in sidebar (3 posts)

  1. spedersonbradbury
    Posted 7 years ago #

    I'm trying to line up two badges next to each other (side by side) in my sidebar, but they won't move from being stacked vertically. I read the posts here and tried the advice, but they are still stuck on top of each other.

    I edited the style.css, adding the two lines at the bottom:

    #left-column .inside ul, #right-column .inside ul {list-style-type: none; margin: 0; padding: 0; }
    #left-column .inside ul li, #right-column .inside ul li {margin: 2px 0 2px 5px; }
    #left-column ul li a.inline{display:inline;}
    #left-column ul li a.inline img{padding:5px 5px 0 0;}

    And then put this into the text widget:

    <img class="alignnone size-medium wp-image-518" title="twitter-lime" src="http://www.vert-a-go.com/wp-content/uploads/2008/11/twitter-lime.png" alt="" width="80" height="60" /><img title="Vert à Go" alt="Vert-à-Go" src="http://pagebadge.peerglobe.com:80/page/badge?profile=profile.ak.facebook.com%2Fobject3%2F430%2F35%2Fn12824002946_4772.jpg&width=60&type=group" border="0">

    Can anyone see what is going wrong? Thanks very much!


  2. Anna Johansson
    Posted 7 years ago #

    Try this instead:

    <img src="http://www.vert-a-go.com/wp-content/uploads/2008/11/twitter-lime.png" title="twitter-lime" alt="" width="80" height="60" style="float:left;clear:none;border:none;margin-left:5px;" />
    <img src="http://pagebadge.peerglobe.com:80/page/badge?profile=profile.ak.facebook.com%2Fobject3%2F430%2F35%2Fn12824002946_4772.jpg&width=60&type=group" title="Vert à Go" alt="Vert-à-Go" style="float:left;clear:none;border:none;">

    You might want to put this afterwards to ensure that stuff below the images dosn't float up next to them:

    <div style="width:100%;float:none;clear:both;">

    let me know if it achieved what you wanted! =)

  3. spedersonbradbury
    Posted 7 years ago #

    Thanks! That code change did make them sit side-by-side (after I resized them a bit smaller to fit)...hoorah!

    I added that extra bit of <div style> code at the end, but ended up taking it out again because it made the entire right sidebar jump down to the middle and sit over top of the main text. So I guess it isn't necessary in this case!

    Thanks very much again for your fast and very helpful response!

Topic Closed

This topic has been closed to new replies.

About this Topic