Home/ Questions/Q 8894663
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T23:33:37+00:00

I have been searching and trying different methods for hours now. I just can’t

  • 0

I have been searching and trying different methods for hours now. I just can’t seem to get these two images and text all on one line. I want both the images and both text to all be on one line arranged image, text, image, text My images are coded like this with simple styles attacted 

 <img style='height: 24px; width: 24px; margin-right: 4px;' src='design/like.png'/><h4 class='liketext'>$likes</h4>
 <img style='height: 24px; width: 24px; margin-right: 4px;' src='design/dislike.png'/><h4 class='liketext'>$dislikes</h4>

My “liketext” class is just has a simple text color modifier. With this code the first image and text are on the same line, and the the next image and text is on the line below. I want all four objects to be on the same line. I really have tried to solve this question on my own and appreciate any help given and hopefully this post can help others as well thank you!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can either use (on the h4 elements, as they are block by default)

    display: inline-block;

    Or you can float the elements to the left/rght

    float: left;

    Just don’t forget to clear the floats after 

    clear: left;

    More visual example for the float left/right option as shared below by @VSB:

    <h4> 
    <div style="float:left;">Left Text</div>
    <div style="float:right;">Right Text</div>
    <div style="clear: left;"/>
</h4>
    • 0