CSS flow justified text around an image

tring to flow text around an image:

HTML

<div> <span id="photo"><img src="photo.png"</span> <span id="text">Lorem Ipsum, blah, blah, blah ...</span> </div>

CSS

#photo {float:left;margin:0px 8px 5px 0px;} #text {text-align:justify;}**

The text flows around the image, but it is not justified (alignment is left). If I float the text element left, then the alignment is correct (justified, as I want), but then the text does not flow around the image, rather it flows below the image - how can I fix this?

-------------Problems Reply------------

The text-align property actually belongs on the enclosing block element not the inline element. So move it to the enclosing block:

div { text-align: justify; }

See 16.2 Alignment: the 'text-align' property of the Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification:

This property describes how inline content of a block is aligned. Values have the following meanings:

(emphasis added)

You need to either take the image out of the span, or float the span left.

Category:css Views:15 Time:2009-12-07
Tags: css

Related post

  • Can I use CSS to justify text with hyphenating words at the end of a line? 2012-03-01

    I have a div that is too narrow to text-align:justify (gaps too wide), but yet looks un-uniform when right- or left-justified, because then there is a large gap at the end of lines. Left-justified looks best, but could I use hyphenation, like in book

  • How to Center-Justify text in CSS? 2011-01-16

    How can I center-justify text? Currently, justify does not center the last line. --------------Solutions------------- You could use the text-align: center; CSS rule. Example: <div style="text-align: center;">I am centered</div> or with an

  • Getting Justified Text in UITextField 2008-12-31

    How do I get justified text with UTTextField. It does have an textAlignment property. But the UITextAlignment constant only has left, right, and center justification. What I am seeking is the Justified text common in word processing app with text flu

  • Android TextView Justify Text 2009-08-18

    How do you get the text of a TextView to be Justified (with text flush on the left- and right- hand sides)? I found a possible solution here, but it does not work (even if you change vertical-center to center_vertical, etc). --------------Solutions--

  • Cocoa Touch text view with aligned, justified text 2010-03-15

    I am trying to create a textview with predefined height that will contain justified text. When entering the text into the view, I need to be able to check when the view is full. How would I do this? Core Text? I am using sdk-3.2. --------------Soluti

  • How to get my jQuery UI "close" button to show up in the upper right of the DIV and not impede the flow of text? 2011-05-13

    As you can see from the demo, I have two divs, notice and content: http://jsfiddle.net/ssZXA/ notice is for error messages that occasionally need to be displayed while content is for the main page content that is always present. I created a button (c

  • Remove Gaps Justified text with Hyphenation 2011-09-08

    Is there a way to remove the gaps on justified text using hyphens with jQuery? Not repeating a bunch of hyphens. I'm using the following plugin: http://welcome.totheinter.net/columnizer-jquery-plugin/ --------------Solutions------------- If the font

  • Android best way to generate an image from a layout engine (justified text, box positioning, embed images-) 2014-03-12

    It's been three days I'm looking for (and test) libs which can perform a generation of an image from textual content. I develop an app on Android with the Augmented Reality Metaio SDK. To apply a texture with text and image embed, I must generate a P

  • Ragged headlines within justified text 2009-02-19

    I am creating a pdf file with Latex via pdflatex and want to have have headlines with ragged text, while the rest of the document should use justified text. This gives me an error (! LaTeX Error: Something's wrong--perhaps a missing \item): \usepacka

  • Is there a clean approach to justify text in Reporting Service? 2009-03-10

    I'm creating a Report using SQL Reporting Services and I need to justify the text inside a textbox. By justify a mean aligning the text to both margin, left AND right. Just like justifying text in MS Word. I've been browsing a lot and found only a fe

  • Automatic image resizing in a CSS flow layout to simulate a html-table layout 2009-07-09

    I have an image that, depending on the screen resolution, drops down out of sight in my CSS flow layout because I have set its width and height to static values. Is there a way in a CSS flow layout to have the image automatically resize while someone

  • Basic CSS for a text link question? 2009-08-28

    Below is the css for a text link in 4 different states - link,visited,hover, and active. Do I need to do this css code for every type of link class I have, some of the classes do not even change the appearance. (link,visited,hover,active) If only the

  • How to fully justify texts programmatically (Delphi)? 2009-10-30

    How can I fully justify a block of text (like MS Word does, not only on the right and not only on the left but on both sides)? I want to justify some texts (mainly arabic text) adjusted to certain screen size (some handheld device screen actually, an

  • How could I justify text in a text_box in Prawn? 2009-12-11

    Is there a way to justify text in pdf.text_box using the prawn plugin? --------------Solutions------------- Here is where the documentation for text_box is: Class::Prawn::Document The text box is like most other prawn functions and takes the data and

  • Justify Text in sIFR 2010-04-12

    G'day friends i want to justify my text using sIFR, Whe i researched on that, i found that sIFR just have 3 options, textalign=center/left/right. But i wanna know how to justify the text..? is there any way i can use textalign=justify? when i use tex

  • Fill CSS box with text from MySQL till there is no overflow, scrollbar, or hidden text 2010-06-16

    I want to fill a CSS box with text till there is no overflow or scrollbar. I fetch text from MySQL. The user clicks a button and the next bit of text that can fit will fill the box. The only way I've figured to do this is by parsing through the text

  • PHP & FPDF: Calculating justified text width 2010-07-20

    so I'm using FPDF in PHP to programmatically generate a PDF file from images and text (not HTML). One of the biggest issues I've been having is being able to wordwrap text around an image. My current algorithm looks like: Get text as an array of word

  • In flex, how to have 'justify' text align option 2010-08-12

    How to make text in flex justified (text-align option) --------------Solutions------------- If I understand you correctly, you want the text of your paragraph to be flush on both the right and left sides, which means you want to set the textAlign sty

  • Justify text in a Report 2010-09-02

    In my work we need to generate contract documents that dynamically extract information from the database to personalize client related information. These documents not only have text, but also they need tables with dynamic rows (ie.: shows some produ

Copyright (C) dskims.com, All Rights Reserved.

processed in 0.097 (s). 11 q(s)