6 replies
  • WEB DESIGN
  • |
At this website I was trying to position social media icons in middle of side bar .

and i tried with this code

<p style="text-align: center;"> <a href="http://www.hoosewifey.com/wp-content/uploads/2013/02/1360535609_social_rss_box_orange.png"><img class="size-full wp-image-290 alignright" alt="1360535609_social_rss_box_orange" src="http://www.hoosewifey.com/wp-content/uploads/2013/02/1360535609_social_rss_box_orange.png" width="48" height="48" /></a><a href="http://www.hoosewifey.com/wp-content/uploads/2013/02/1360535602_social_twitter_box_blue.png"><img class="size-full wp-image-289 alignright" alt="1360535602_social_twitter_box_blue" src="http://www.hoosewifey.com/wp-content/uploads/2013/02/1360535602_social_twitter_box_blue.png" width="48" height="48" /></a> <a href="http://www.hoosewifey.com/wp-content/uploads/2013/02/1360535592_social_facebook_box_blue.png"><img class="size-full wp-image-288 alignright" alt="1360535592_social_facebook_box_blue" src="http://www.hoosewifey.com/wp-content/uploads/2013/02/1360535592_social_facebook_box_blue.png" width="48" height="48" /></a></p>

icons are close to right instead of centered. I tied alling right, center or left still doesnt work. how do i can position them middle of sidebar please? thanks
#fix
  • Profile picture of the author AWill
    You need to get rid of the "alignright" class in each image. If you uploaded these images with the media uploader in wordpress, just choose center alignment and that should change the class to "aligncenter" and fix your issue.
    {{ DiscussionBoard.errors[7722532].message }}
    • Profile picture of the author RandyHarke
      Hei esquiree,
      instead of use
      Code:
      <p>
      maybe you better use tag
      Code:
      <center>
      and place before you social media code in the widget.
      Hope this useful
      {{ DiscussionBoard.errors[7723741].message }}
      • Profile picture of the author AWill
        Originally Posted by RandyHarke View Post

        Hei esquiree,
        instead of use
        Code:
        <p>
        maybe you better use tag
        Code:
        <center>
        and place before you social media code in the widget.
        Hope this useful
        This is bad advice. The <center> tag is deprecated in HTML 4.01 and not supported in HTML5. Don't use it.
        {{ DiscussionBoard.errors[7723829].message }}
  • Profile picture of the author OldLodgeSkins
    You could try putting your code inside a fixed width div and centering the div. That's assuming they always have the same width which should be the case with social buttons, so once you find it out you'll be able to give your div the right width and from there it should be ok.

    Assuming for example what you're trying to center is 300px wide:
    Code:
    <div style="width: 302px; margin-left: auto; margin-right: auto;">
    <!-- whatever you want here -->
    </div>
    I always give a couple extra pixels to the div just to make sure the content fits in it.
    If you're not sure of the right width just pick a random value and try it, then adjust until you find the right value.

    Seb.

    PS: AWill is right, the <center> tag has been deprecated for a long time now. Use CSS.
    Signature
    Do you use Facebook ? Then you can make money just by inviting people to a Facebook group ! It's called the Instant Income System. How cool is that?
    {{ DiscussionBoard.errors[7725897].message }}
  • Profile picture of the author blogfreakz
    yes this could be solve using fixed div like what OldLodgeSkins suggested.. good luck!
    {{ DiscussionBoard.errors[7735635].message }}
  • Profile picture of the author esquiree
    Thanks everybody. I fixed it. looks better now
    {{ DiscussionBoard.errors[7737991].message }}

Trending Topics