Space at top of topics, page layout/stylesheet issue

[helseykc]

Hello!

I have a really odd problem - don't we all?! On the front page of my printed output I want an image to appear right at the very top, no space to the left of right at all. So I have a page layout called 'Front' and the page 'First' has simply one body frame exactly the same size as the page and with no margins. I have my TOC set up and the front page uses the 'First' page of the 'Front' page layout.

I know the set up is fine because it works, but only with one stylesheet. If I set my target to use my old stylesheet my front page topic displays perfectly, both in the Flare editor and when creating the output. If I set my target to use my new stylesheet, there is a great big gap at the top of my topic before the image. I have managed to get ALMOST all of the white space to the left of the image to go away but I cannot lose the white space above.

I am assuming that this is an issue with my new style sheet because it works with the old one (cunning detective work, huh?) but I cannot find what is causing the space above my image. I have set all the styles to have no top margins and things like that...

Hope someone can help. It's only my third week in the job and I'm really stuck!

Helen

[nickatwork]

Did you check the html and/or the body style? They usually have a little spacing in there tucked away.

[LTinker68]

There are a few places where the spacing could be coming from:

• Margin, padding, line-height set in html or body tag, as Nick mentioned
• Margin, padding, vertical alignment of base img tag or class, if you're using one
• Margin, padding, line-height, vertical alignment of whichever tag is containing the image (e.g., base paragraph tag or class)
• Inline formatting on the img or container tag in the page layout
• I don't have Flare open at the moment to double-check, but I believe you can also set some things in the frame containing the image on the page layout that might affect spacing, although if it works with the old stylesheet then it probably isn't this one (or the inline formatting one above)

[likeller]

Hi!

I have a somewhat similar issue in that I'm not sure how/why there is extra space appearing between lines when I have an in-line image in a paragraph (or list item, etc.).

I set the line height on this image class to be smaller than the line height of the text. No top or bottom margins/borders/padding. I set the vertical alignment to be text-bottom. When I applied the class to the image the image resized itself properly.

But when I highlight the line of text that contains the image, there is a small bit of "blue highlighting" on all sides but significantly more "blue highlighting" on the bottom of the image which explains the extra space between lines but I have no idea where it is coming from because I checked all the css properties on the image and except for what I mentioned they are blank.

The image was cropped in Paint (no extra whitespace, just the visible area of the image). If it has something to do with how it was cropped (the image file somehow carries extra space around it) is there a simple way to fix that?

Help please!

[ChoccieMuffin]

Do you have a specific tag applied to the image or are you just using the parent <img> tag? Unless you're using a specific class such as img.IconInText where you've defined the margins, padding and borders (I can never remember which is which, but it does matter) then you might find that space is coming from the default settings for <img>.

[likeller]

Hi ChoccieMuffin,

I do have a separate class for in-line images with the line height for this image class set to be smaller than the text line height, with the rest of the values left blank, so i'm really unsure where this extra space is coming from.

Thanks!