Take the 2-minute tour ×

I've set up my blog, doopist.com, using tumblr.

I'm trying to line up a twitter Follow button and Facebook Like button with my blog's header logo image. Currently, the Twitter icon is aligned at the top of the top banner while the FB button is closer to being centered. I am attempting to vertically center the buttons similarly to how the logo is centered.

I don't know much CSS and have tried to make a div style with vertical align middle but that caused the tumblr icon logos (random post, archives, etc.) to bump down to a new line, which is not desired.

I was curious if anyone had suggestions on how to vertically center the Twitter and FB buttons vertically. Thanks so much for your time and help.

share|improve this question
Can you put just the navbar html and related css in a jsfiddle please? –  brbcoding Mar 7 '13 at 20:16
add comment

1 Answer

Few CSS changes

#header, #header .inner { height:48px; position:relative; }

On your iframe add preferably in a class:

position: absolute;
left: 200px;
top: 10px;

On your span holding facebook:

position: absolute;
left: 365px;
top: 15px;

Again preferably in a class.

You really don't need the extra spans around each iframe. Just add a class to each iframe to specify the styles.

share|improve this answer
add comment

Your Answer


