Because the floated element is both within and without the flow, this sort of thing is bound to happen. What's going on? Well, the content of the paragraphs is being "displaced" by the floated element. However, each paragraph's element width is still as wide as its parent element. Therefore, its content area spans the width of the parent, and so does the background. The actual content doesn't flow all the way across its own content area in order to avoid being obscured behind the floating element.

Monday 22nd of January 2018 11:19:59 AM

CSS Style Guide

XHTML: What is XML?

XML (Extensible Markup Language) is a “super” markup language from which programmers can develop other, custom markup languages and specialized applications. XHTML (Extensible Hypertext Markup Language) is one such markup language.

Programmers already use XML for database and catalog work, and XML also acts as the foundation for standard web protocols including Scalable Vector Graphics (SVG), Synchronized Multimedia Integration Language (SMIL), Wireless Markup Language (WML), and Platform for Privacy Preferences (P3P).

For information about these web protocols, visit W3C.

« XHTML Section Index | XHTML Guidelines »

make paragraphs use an upright font, as usual, and cause the EM and I elements to use an italic font -- again, as usual.

Figure 5-25

Figure 5-25. Ordinary document behavior through CSS

On the other hand, you might decide that there should be a subtle difference between EM and I:

P {font-style: normal;}
EM {font-style: oblique;}floated so far up that it intrudes into a paragraph that has alreadybeen displayed by the user agent. In this case, it's up to theuser agent to decide whether or not the document should be reflowed.The CSS specifications explicitly state that user agents are notrequired to reflow previous content to accommodate things whichhappen later in the document. In other words, if an image is floatedup into a previous paragraph, it may simply overwrite whatever wasalready there. On the other hand, the user agent may handle thesituation by flowing content around the float, even though doing soisn't required behavior. Either way, it's probably a bad