Skip to main content

How Can I Flow Text Around Images?

  • Chapter
Getting StartED with CSS
  • 867 Accesses

Abstract

It’s time to bring the sample page alive with some images. The reason I have not used images so far is because HTML treats images as inline elements. As you saw in the previous chapter, inserting an image in a block of text forces the text to align with the bottom of the image. In order to get the text to flow around the image, you need to use the CSS property called float. In principle, using float is very simple, and it can be used on any HTML element, not just images. You float the element to the left or right, and everything moves up to fill the vacated space alongside, as illustrated in Figure 4-1.

The CSS float property is used, among other things, to wrap text around images.

This is a preview of subscription content, log in via an institution to check access.

Access this chapter

eBook
USD 19.99
Price excludes VAT (USA)
  • Available as PDF
  • Read on any device
  • Instant download
  • Own it forever
Softcover Book
USD 24.99
Price excludes VAT (USA)
  • Compact, lightweight edition
  • Dispatched in 3 to 5 business days
  • Free shipping worldwide - see info

Tax calculation will be finalised at checkout

Purchases are for personal use only

Institutional subscriptions

Preview

Unable to display preview. Download preview PDF.

Unable to display preview. Download preview PDF.

Authors

Rights and permissions

Reprints and permissions

Copyright information

© 2009 David Powers

About this chapter

Cite this chapter

Powers, D. (2009). How Can I Flow Text Around Images?. In: Getting StartED with CSS. Apress. https://doi.org/10.1007/978-1-4302-2544-7_4

Download citation

Publish with us

Policies and ethics