rampion
rampion

Reputation: 89133

CSS: prevent text overlap

I'm using some customized <sub>...</sub> to provide index subscripts in certain <tt> regions:

 tt.indexed sub
 {
     color:#0000ff;
     position:relative;
     top:0.5em;
     right:1em;
     margin-right:-0.5em;
 }
 tt.indexed sub:last-child
 {
     margin-right:-1em;
 }

Basically to pretty up stuff like 000001 002103 104005 106007 and make it a bit more compact.

However, I'm having an issue where lines beneath my <tt class="indexed"> regions overlaps the custom subscripts (just a little, but it's visually annoying). I tried upping the margin-bottom on tt.indexed sub, but it didn't seem to have an effect. Do I have to set a margin-bottom on tt.indexed, or is there a setting I can use in tt.indexed sub?

Upvotes: 0

Views: 2758

Answers (1)

user165081
user165081

Reputation:

Try using a line-height declaration with em.

Upvotes: 1

Related Questions