HTML Text Line Control

I think I’ve read every post and can’t find an answer.

As noted by others, HTML text automatically puts a double line spacing after a hard paragraph return. Using a soft return (shift+enter) pulls the following text up right under the line above.

The problem is that I want to use h1 for the first line followed by h2 on the second line with minimal spacing. Said another way, I want to change the h-tag by line within the same HTML box. I have played around with leading and found that I can come close using bizarrely small font px settings. This works okay with large fonts (42px h1 and 18px h2). However, with smaller sizes (22px h3 and 14px p) I still get too much space after the first line.

Aside making each tagged text its own HTML box, is there I trick I’m missing?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

How about using a Space After or Space Before?

Bob


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

You may want to look into using margin’s for the header styles (h1, h2, h3, h4). That would separate the two (h1 start from header tag) better. You could also look into ‘display:block’ as a name and value in your ‘Extended’ window in the CSS window.

So if you had code that looked like:

h1
h2

You could go to the CSS window, click on the H1 tag, click Extended, add in margin-bottom in the name field, enter the number of pixels of space you want underneath that…say 10px…and then click ok and then try and see if a name of ‘display’ and a value of ‘block’ is necessary. It might not be. Then in the code above your h1, or any h1 tag rather, would have a 10px margin underneath it.

You could then apply the same principles to the h2 if you needed to separate it from a starting paragraph.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

H tags are already display:block by default. You won’t hurt anything
by declaring it, but you won’t gain anything either.

Walter

On Feb 27, 2010, at 1:57 PM, Dan J wrote:

then try and see if a name of ‘display’ and a value of ‘block’ is
necessary. It might not be.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

What appears to be the problem is using any H tag at all. It would appear that you can modify such things as font, size, color, etc. in an <h#> tag, but not the amount of margin below it, which is essentially what I’m attempting to do.

It works just fine on HTML text that carries no H tag. How to create the soft return when using an H tag is the puzzlement. I want the margin-bottom to be zero, just as if no H tag were applied. Dan, I attempted your suggestion with no visible results.

Any other thoughts?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Try adding margin-bottom 0px to h1 tag, and margin-top 0px to p tag. If you want the same spacing between h1 and h2 then add margin-top 0px and margin-bottom 0px to the h2 tag.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Bing-bing-bing-bing-bing, we have a winner! Thanks chuckamuck.

Adding the “margin-top 0px” to the tag that follows h1 did the trick. Both the “margin-bottom 0px” for the h1 tag and “margin-top 0px” for the following tag need to be present to snug the two styles together.

Your sagely advice is greatly appreciated.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

UPDATE, the prize is taken away from chuckamuck and given to Robert B.

Sorry Bob (Chuck too). When I read your post the first time I misread it as a simple space before and after the text in the text box.

What Robert B meant was using the Paragraph settings for CSS menus “Space before” and “Space after.” This method has the added advantage of showing a closer match to the final layout while still in the Page view.

Thanks to all for your advice.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

For future reference this is why I find resetting the CSS to be so
useful; it provides a common baseline from which you can build on
without having to worry about default values for

, line-height,
margins, padding and so on. A little extra work up front but once you
create the reset styles you can reuse the code for each project if
you’re so inclined. Something to keep in mind.

Thread: http://www.freewaytalk.net/thread/view/60783#m_60793
Example: http://www.xiiro.com/demo/css_reset/index.html

Todd


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options