CODEWITHSUNDEEP
htmlcssimage
Kairan
Kairan

Reputation: 5542

How do you make an image allow text to wrap around it in HTML?

I am starting my first site and it is posted online here: Link to my site

However, as you can see the UL (list) or any other text is on a new line instead of side by side with the image. I figured it should be on the same line since it is in the same tag but it is not.

How to fix?

Upvotes: 0

Views: 1233

Answers (2)

Zachary Kniebel
Zachary Kniebel

Reputation: 4774

Use the float CSS property. This is actually the original purpose of the float property.

e.g.:

img#yourImage {
    float: left;
}

Don't forget to use the clear property on an element after the element to which you applied the float. Alternatively, you can use clear on a "virtual" element created with :after.

Update: This site actually provides a good explanation and example.

Upvotes: 1

Kevin
Kevin

Reputation: 15

add this css to ul.favourites

display: inline-block;
vertical-align: top;

I personally prefer this over float:left. I hope this helps!

Upvotes: 0

Related Questions