How to change social media icons to horizontal position

• 

  tarafindingwholehealth · Member · Jul 3, 2013 at 1:22 am

  • Copy link
  • Add topic to favorites

  I’ve been trying various html and css methods and I’m still unable to get my social media icons to line up horizontally instead of vertically.

  They are:
  img 1
  img 2
  img 3

  I want:
  img 1 img 2 img 3

  I have the watson theme and the customization package.

  Thanks in advance!

  Here’s the website: http://findingwholehealth.com/

  The blog I need help with is: (visible only to logged in users)

• 

  designsimply · Member · Jul 4, 2013 at 12:00 am

  • Copy link

  I checked http://findingwholehealth.com/ and I found that your social media icons were updated to display in a horizontal list already. It looks like you used the following CSS to make the update:

  .icons {
  	text-align: center;
  }
  
  .icons_img {
  	display: inline-block;
  }

  Nice work!

• 

  tarafindingwholehealth · Member · Jul 4, 2013 at 12:24 am

  • Copy link

  Thanks! It took a lot of trial and error but I think they look pretty good. Thanks so much for following up with me!

• 

  tarafindingwholehealth · Member · Jul 9, 2013 at 11:01 pm

  • Copy link

  Oh no – I’ve been messing around and cannot remember how I need to structure the html in the text widget to call upon the css I created to make them line up horizontally! Can you remind me what sort of “div” code I need?

• 

  justpi · Member · Jul 9, 2013 at 11:38 pm

  • Copy link

  You don’t need to add anything in the widget. Just add this in the CSS editor:

  #text-3 img {
      display: inline-block;
  }