I’m struggling to align three divs in a row, each with unique cosmetic styles. Two have images on the left and right sides, while the middle one contains a text-filled div.
While I’ve managed to fit the image in the divs just fine, the middle div with text isn’t lining up horizontally with the other two.
Below is the HTML code:
<div class="eggpic">
<img src="smiley.gif"/>
</div>
<div class="timersection">
<div class="timersectiontext">Hello</div>
</div>
<div class="buttonpic softboil">
<img src="smiley.gif"/>
</div>
Here is the corresponding jsfiddle link: http://jsfiddle.net/4bg7uyoj/1/
If anyone could provide assistance in aligning all the divs properly, it would be greatly appreciated!
Many thanks in advance.