user3403328 user3403328 - 8 months ago 41
CSS Question

Align multiple images/headings on same line - bootstrap 3

I'm trying to align 3 headings and 2 images on the same line, like so:

Heading Image Heading Image Heading




I tried using Bootstrap's media component, like so:

<div class="media">

<h5 class="media-heading">Media heading</h5>
<img class="media-object pull-left" src="img/img.png" alt="..." />
<h5 class="media-heading">Media heading</h5>
<img class="media-object pull-left" src="img/img.png" alt="..." />
<h5 class="media-heading">Media heading</h5>

</div>


But I'm having a hard time getting everything to be on the same line. Any ideas? Thank you.

Answer Source

Please try this way

<div class="media">

    <h5 class="media-heading pull-left">Media heading</h5>
    <img class="media-object pull-left" src="img/img.png" alt="..." />
    <h5 class="media-heading pull-left">Media heading</h5>
    <img class="media-object pull-left" src="img/img.png" alt="..." />
    <h5 class="media-heading pull-left">Media heading</h5>

</div

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download