CODEWITHSUNDEEP
csshtmlstyling
TheMonkeyMan
TheMonkeyMan

Reputation: 9152

Positioning of Text with Images HTML

I have a small problem here. I have a Div and I would like the text to float either side in the centre.

I include a screenshot of it presently and how I would like it to look does anyone have any idea if this is achievable or do I need to make it an actual image?

Twitter Facebook Feeds

JS Fiddle >> http://jsfiddle.net/DU4u4/

Upvotes: 1

Views: 65

Answers (3)

Vijay Sarin
Vijay Sarin

Reputation: 1336

Hope, this is something you need...

Check DEMO

HTML

<div id="socialConnect">
    <div class="fbConnect">Follow us on</div>
    <div class="twitterConnect">OR</div>
</div>

CSS

.fbConnect{
    background-image:url('http://www.seedaneed.com/images/fb_btn.png');
    background-repeat:no-repeat;
    background-position:right;
    height:32px;
    width:125px;
    float:left;
    padding-top:10px;
}

.twitterConnect{
    background-image:url('http://www.boson.com/images/twitter-button.jpg');
    background-repeat:no-repeat;
    background-position:right;
    height:32px;
    width:60px;    
    float:left;    
    padding-top:10px;
    padding-left:5px;
    text-align:left;
}

Upvotes: 1

Rohit Azad Malik
Rohit Azad Malik

Reputation: 32172

..........................................

Now used to line-height for this

Upvotes: 2

Marco Risi
Marco Risi

Reputation: 108

You can try with vertical-align: middle

Upvotes: 2

Related Questions