Action bar alignment

Hi,

I need to align the action bar to the right next to the social icons, how can I do this?

Comments

  • Hi,
    It is aligned? Please look: http://prntscr.com/f3iemw
    thanks
  • Hi,

    Yes, I've navigated the forum and found you have helped with a bit of CSS you posted, so I've fixed that with the following:

    #Action_bar .social { display: block; float: right;}
    #Action_bar .contact_details { float: none; }
    #Action_bar { text-align: right; }

    The problem now is that I have aligned the action bar to the right, but the social icons are messed up. I see they are placed below the action bar, which falls under the fixed header. Could you help me out here?
  • Hi,
    You are not understanding the FLOAT property correctly, if you set it to none, elements around it will go to a new line. It does not work like text-align. So, what you have to do is set the float from 'none' to 'left
    ' or right. Look on the screen: http://prntscr.com/f3y51g
    You can set the social menu to left and contact details to right, or both to right.
    thanks
  • Okay, so I've done that. I've set all the elements to float right. What I get now is the social icons on the right side of the action bar, but ON THE LEFT of the contact details. Please see the screenshot. How do I fix this?


    I'm a rookie at custom css, but I'm trying to learn. Thank you for your informative replies. I'm working hard to learn more every single day, and I love your themes. 
  • It is not possible because the contact details is before the social icons in the HTML structure, this is why the floated elements are this way. Look: http://prntscr.com/f4cd6l
Sign In or Register to comment.