I have a blockquote that flows around a left-floated image. How can I make the blockquote indented 2em from the left margin of the page when it is above or below the image but indented 2em from the right side of the floated image when it is along the same line as the image? I am using HTML and CSS.
+1
A:
img{
float:left;
margin-right:1em;
...
}
blockquote{
position:relative;
left:1em;
margin-left:1em;
...
}
Normal text is 0em from the left margin of the page and 1em right from the image. Blockquote is 2em from the left margin of the page and 2em right form the image.
azram19
2010-08-03 16:40:52
Doesn't work coming around the float - there is no indent to the left when this is next to a float.
ajd
2010-08-03 21:23:25
You're right, sorry for not checking it earlier. I've fixed it and it works for me now.
azram19
2010-08-04 05:56:07
Thanks for your help, but that indents both the blockquote and non-quoted text. I want the blockquote to be 2em to the right of the image, but non-blockquoted text to only be 1em to the right of the image.
ajd
2010-08-04 21:16:26
Another fix makes it working.
azram19
2010-08-05 08:03:31
Eh - still not perfect if there is a right float or other element on the right side of the text, since the blockquote overlaps the right float. I don't know that you can do it perfectly in CSS though.
ajd
2010-08-07 21:31:13