Member Avatar for sheara

Hi,

I can't figure out why my text does not wrap around my image on my home page (paragraph 3) www.robotic-prostatectomy.com, but on interior pages, the text is wrapping around the images no problem. in my css i have a float: left. clearly i am new to this, what am i missing?

thanks for any help.

  • 2 Contributors
  • 1 Reply
  • 94 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by MidiMagic

Dani AI

Generated

— the fact that wrapping works on interior pages but not the homepage strongly suggests a markup/CSS difference between the two templates. was correct to point at container boundaries: a floated image only lets inline text flow around it when the image and the paragraph share the same block flow. Common homepage causes include the image being wrapped in a separate div or grid column, an inserted clearing element, or a framework class that changes display/flow on that template.

Practical debugging steps that identify the exact cause: open the browser developer tools and compare the DOM and computed styles for the image and the paragraph on the homepage versus an interior page. Look for extra wrappers, a closing tag between image and text, clear rules, or a parent applying a clearfix/overflow that isolates the float. Also check the image plus margins against the container width — if there is no room, the paragraph will drop below the image.

Typical fixes are to place the image and the following text in the same block (same paragraph or div), remove the unwanted clearing/wrapper, or apply the appropriate float utility from the CSS framework so the float participates in the same flow. For details on how floats and clearing behave see the MDN float reference (https://developer.mozilla.org/en-US/docs/Web/CSS/float) and the CSS-Tricks clearfix pattern (https://css-tricks.com/snippets/css/clear-fix/).

Member Avatar for MidiMagic

You have them in different divs. In order for text to wrap around an image, both have to be in the same container.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.