On 10/12/2012 07:57 PM, Boris Goldowsky wrote:
> I'm having trouble with image display in certain circumstances. Try this:
>
> Install DTBook configuration
> Create new DTBook document
> Insert an<img> element in the body, and set it to point to an existing image
> in your filesystem. The image should display fine in the editor.
> Wrap the<img> in an inline element, such as<a> or<cite>.
> Now the image no longer displays properly (you may have to save and re-open
> the file to see the breakage).
Is this a regression caused by changes in XXE?
>
> I am pretty sure this is due to the image element being specified as
> display:block for editing purposes
I'm not sure to understand "for editing purposes".
> , while the container around it is displayed as an inline. I see how this
> can confuse the layout, but I don't know why it causes the image to end up
> not displayed at all.
>
> I could probably cause<img> to be treated as an inline in this context, but
> I won't be able to get rid of all such issues. DTBook, unfortunately,
> contains various block elements which are not illegal as children of inline
> elements.
>
> [this is xxe pro 5.4 on mac os]
>
This is a common problem which also happens with other document types.
* The simplest approach is to specify display:inline for img (like in
XHTML).
Excerpts from the XHTML CSS:
---
img {
display: inline;
content: image-viewport(attribute, src,
data-type, anyURI,
content-width, attr(width),
content-height, attr(height));
}
---
This approach should work fine whatever is the parent of img.
* The hardest approach is to test all cases and set display accordingly
(like in DITA).
Excerpts from the DITA topic CSS (a DITA image may contain editable
child elements such as <alt>: a quite hard case):
---
image {
display: inline;
}
fig > image,
imagemap > image,
image[placement=break] {
display: block;
margin-top: 0;
margin-bottom: 1.33ex;
}
image:before {
display: inline;
content: gadget("com.xmlmind.xmleditext.dita.Image");
}
fig > image:before,
imagemap > image:before,
image[placement=break]:before {
display: block;
margin-top: 1.33ex;
margin-bottom: 0;
}
---
* Otherwise you may want to give a try to:
** display:inline-block; in case you want to have border or padding
around img (which caused you to specify display:block for img in the
first place).
Note that inline-block is basically an inline. Therefore this should
work fine whatever is the parent of img.
** display:inherit; in case this happens to solve your problem
automagically.
--
XMLmind XML Editor Support List
[email protected]
http://www.xmlmind.com/mailman/listinfo/xmleditor-support
