Support

Home Forums Social Media Buttons Add-on what is the css code to display the social buttons horizontaly

what is the css code to display the social buttons horizontaly

Posted: January 10, 2013 at 1:31 pm


nsantossilva

January 10, 2013 at 1:31 pm

Hello,

i added to my custom css the

.ee-social-media-buttons {
background-color:transparent;
background-position:initial initial;
background-repeat:initial initial;
border:0;
font-size: 100%;
outline:0;
padding:0;
vertical-align:baseline;
}

and have been playing around but i can’t place the buttons horizontally can you help me with this?

Thanks

Nuno


Dean

January 11, 2013 at 12:52 am

Hi Nuno,

By default they should be horizontal.

Have you got a link to an example?


nsantossilva

January 11, 2013 at 2:39 am

Hi Dean

Once again 😉

The buttons dont have any space, and what i ment was to have them all in a single row, is this possible?

Thanks

Nuno


Dean

January 11, 2013 at 3:41 am

Hey Nuno,

The default (using the twentyeleven theme with ThemeRoller turned on in the Event Espresso options) is like this: http://d.pr/i/FQg2

The CSS control the main structure is

for the containing div
.ee-social-media-buttons {}

for the individual button containers
.ee-social-media-button

So by adding something like padding-right:30px; to the individual buttons css class you can add some space.

The horizontal alignment, really depends on what CSS is controlling or overrulling the defaults, but generally a float:left; should do it, but as said it depends.


nsantossilva

January 11, 2013 at 5:55 am

Hi Dean,

Thanks it is done. 😉

The support post ‘what is the css code to display the social buttons horizontaly’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Support forum for the Social Media Buttons add-on.
Documentation for Social Media Buttons Add-on
http://eventespresso.com/wiki/social-media-buttons-add-on/

Status: closed

Updated by  nsantossilva 6 years, 10 months ago ago

Topic Tags

Notifications

This topic is: resolved
Do NOT follow this link or you will be banned from the site!
[for="input_96_5_3"]
[for="input_96_5_3"]
[gravityform id=96 title=false description=false]
  • This field is for validation purposes and should be left unchanged.
[i]
[i]
[gravityform id=69 title=false description=false]
  • This field is for validation purposes and should be left unchanged.