CODEWITHSUNDEEP
htmlcss
Ian
Ian

Reputation: 11

Can't figure out how to align HTML/CSS Divs

I'd like to align horizontally an image and paragraph of text next to each other within my main div element of my web page.

The divs are wrapped like this:

<div id="main">
    <div id="image"> 
    </div>
    <div id="paragraph">
    </div> 
</div>

Is this the right layout? If so, what CSS do I need?

Upvotes: 1

Views: 52

Answers (2)

tariq99885
tariq99885

Reputation: 16

You can do using two way: Firstly, From your markup, You can use css to float: left image and float: right paragraph. Secondly, 

<pre><div id="main">
  <img src="images/img.jpg" alt=""> 
  <p>your text</p>
</div></pre>

For this this code you can use float: left for image, paragraph text auto align right

Thanks

Upvotes: 0

Ryan Novas
Ryan Novas

Reputation: 130

You need to set both of the inner divs to

display: inline-block;

Check out this fiddle. https://jsfiddle.net/m8athtLp/light/

Upvotes: 2

Related Questions