How to lose unused white space inside div?

This forum is for all Flare issues related to styles, stylesheets and XML.
Post Reply
ajturnersurrey
Sr. Propeller Head
Posts: 346
Joined: Fri Nov 05, 2010 3:30 am

How to lose unused white space inside div?

Post by ajturnersurrey »

I am tying myself in knots trying to recreate something in Flare html5 help that was never intended for it. :roll:
Here's hoping someone can suggest a way to untangled this:

In two pictures.

I am getting this -
div text and image.png
lots of white space inside the div (suspiciously about the same amount that would be needed if the picture was placed inline)

but I want this -
div text and image ideal.png
gold border neatly around the text and image

In an attempt to fix it I tried
div.figure_with_text has a solid 2px gold border, 0px margin, padding 0px 2px 2px -75px, overflow hidden
(it previously had 2px padding at the bottom but the same result)
It contains a couple of paragraphs of text then
img.righthandside which has 10px padding, position relative, left 70%, top -75px

Any ideas?
You do not have the required permissions to view the files attached to this post.
NorthEast
Master Propellus Maximus
Posts: 6359
Joined: Mon Mar 05, 2007 8:33 am

Re: How to lose unused white space inside div?

Post by NorthEast »

ajturnersurrey wrote:Any ideas?
You could try:

(1) Position the image before the paragraphs in the HTML, and use float: right for the image (instead of relative positioning).

Code: Select all

img.righthandside
{
   float:right;
}
(2) In div.figure_with_text, change the -75px padding as negative values are invalid.
ajturnersurrey
Sr. Propeller Head
Posts: 346
Joined: Fri Nov 05, 2010 3:30 am

Re: How to lose unused white space inside div?

Post by ajturnersurrey »

I was convinced merely floating right would obscure my floating side menu, so I'd been trying to stay close to the absolute positioning used in pdf, but you were right. Thanks for your help.
Post Reply