Search code examples
csscentervertical-alignment

How to vertically align middle some header text between 2 header images on a website?

Here is the url: www.dealflurry.com I want to use css. I cannot figure out how to get the header text that says "Deal Flurry" to be vertically in the middle between the 2 images around it. The text is staying at the bottom of the images instead of being in the middle. I have tried putting the text and images in div's but that didn't work the way I did it. I would appreciate any help!

Solution

  • add vertical-align: middle; to both your images in a class or an inline style (preferably a class) and it will fix it.

    Below is your complete updated header div code using inline styles:

    <div class="header">

<img height="200" src="http://www.dealflurry.com/images/HiRes.jpg" style="vertical-align: middle;">

Deal Flurry

<img height="200" src="http://www.dealflurry.com/images/balloons.jpg" style="vertical-align: middle;">

</div>