[Plugin: Jetpack by WordPress.com] How I can move sharing button back to left side.

On your CSS add:

.sharing {
padding: 0 !important;
margin: 0 !important;
}

If Antonio’s fix doesn’t work, try this

Line 121 to 124 in jetpack/modules/sharedaddy/sharing.css locate this block of code

div.sharedaddy .sd-content {
	width: 82.125%; /* 530px / 640px */
	float: right;
	margin: 0;

Change the width setting to 100%; (you can leave the rest unchanged.)

Thank both of you so much.

I just found about mikeotgaar post above by myself too. But wordpress did not email that to me early. So I confirm change width to 100% solve my problem. Now my website look nice again.

Ooh, thanks! That was driving me crazy.

Also, to get rid of that annoying grey line they added in 1.6.1 (between your content and the sharing buttons), comment it out in jetpack/modules/sharedaddy/sharing.css beginning at line 108:

div.sharedaddy div.sd-block {
/* border-top: 1px solid #ddd;
border-top: 1px solid rgba(0,0,0,.13); */
padding: 10px 0 5px;
margin: 0;
width: 100% !important;
}

This helped me a lot. Thanks everyone!

Thanks for the tips. It still did not float right again, so I added this to the same css file:

div.sharedaddy {
	float: right;
}

Hi All,

I would like to remove the space for the “Share” text and center align the share buttons.

I would be really appreciated if someone could give me a hand with the CSS.

Here is a link the shows the layout issue: https://www.humanoidplatform.com

James

@jnordstrom

Does this close to the layout you want ?
https://ruzzme.files.wordpress.com/2012/09/147.jpg

If you want the layout like in the picture.

1. Use css editor adjust width first. Default is 82.125%. You can change it more than 100% but I think it harder for align.

2. I think you should remove print button, may be Email button too. I don’t think someone will print. Goole Plus button should be in same line now.

3. Now adjust the margin for move button set to center. I adjust the second one (Right margin), from 0px to 20px.

4. Play and Test ??

CSS File that you need is sharing.css, should be line 121.
Hope this can help, Sorry for my english ??

Perfect thank you so much for your help.

Is there a way to make these CSS edits in my main CSS file rather than in the sharedaddy/sharing.css file? I’m concerned that I would have to re-implement them every time I update the plugin if I commit them directly to the sharing.css file.

I basically just want to add some space between the end of the article and the sharing buttons. Should I use margins for that?

1. I think take a note what we need to do every time when we update will be easier. I have a same problem but not too bad if we know what to do.

2. Yes, you can use top margin. try with “div.sharedaddy div.sd-block” it work with me.

I’ve tried the above code snippets and none of them work. Neither the alignment nor the line (which doesn’t bother me). Any idea how I can move the icons to the left and put more space between them? https://blog.stratamp.com/

I have tried every possible combination of classes or id’s in the source code of the page. The only one that does anything is the individual anchor class name – which is numbered, so it can’t be used because it only affects one set of icons on the page.

@charles_i Try adding the following code to your custom CSS:

div.sharedaddy .sd-content {
    float: left !important;
}

div.sharedaddy .sd-content ul li {
    margin: 0 25px 5px 0 !important;
}

Brilliant! Thanks. I thought I tried every combination I could but I didn’t have that second one with the ul li written like that.

Charles

Any idea how to put the social icons on top of the post as well as on the bottom of content ?

Thank you