Aligning text next to an image

[Kralle]

Hello again.

I would like some help with aligning a h2-title next to an image. I’d like the title to be vertically in the middle, hence the line-height: 34px; but I honestly don’t know what to do.

I tried using the align: “left”; to the img, but since that’s not allowed anymore, I couldn’t find a way in CSS to do the job.
The code is as follows:

Title


Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text 


Read more here.

And the CSS for it:

#sidebar-wrapper {

margin-top: 0px;

padding-bottom: 30px;

width: 300px;

float: right;

}



#sidebar {

padding: 0 10px 0 10px;

color: #666666;

font-size: 11px;

line-height: 15px;

}



.widget h2 {

line-height: 34px;

}



.ikon {

I've tried the most, but couldn't find a proper way to do what I want

}

Thanks in advance,
Kralle

[clokey2k]

Try this:

.widget h2 {

display: inline-block;

}

.ikon {

vertical-align: middle;

}

You’ll have to wrap the ‘regular’ text in a block level element ( p tags should be fine) or they will appear next to the heading as well.

Because the h2 is a block it occupies 100% width by default!

Hope this helps.

[Kralle]

Thanks a lot for your help. I learned something new today, wuhu!

[Author]

Posts