hanging indent

[Oldpilot]

I have a bibliography in my most recent project, and I called for a hanging indent in the html. It looks just fine on the Kindle, but when I converted the mobi file to an epub on Calibre, then opened it in Sigil for tweaking, the hanging indent turned out to be normal paragraphing set in from the left margin. Here's the relevant code from the stylesheet:

.calibre18 {
border-bottom: 0;
border-top: 0;
display: block;
margin-bottom: 0;
margin-left: 22px;
margin-right: 0;
margin-top: 0;
padding-bottom: 0;
padding-top: 0;
text-align: justify;
text-indent: 1.5em
}

I reckon I should get rid of margin-left: 22px; but how do I transform the normal indentation to a hanging indent? By changing text-indent: 1.5em to text-indent: -22px; ?

While on the subject of CSS, if I want a paragraph to be ragged right, would I change text-align: justify; to text-align: left; ?

Thanks!

[Jellby]

Originally Posted by Oldpilot

I reckon I should get rid of margin-left: 22px; but how do I transform the normal indentation to a hanging indent? By changing text-indent: 1.5em to text-indent: -22px; ?

Yes, hanging indent is obtained with:

margin-left: x+y
text-indent: -x

where x is the amount you want it to "hang", and y is the additional left margin you want, if any. In your case x=22px, y=0.

While on the subject of CSS, if I want a paragraph to be ragged right, would I change text-align: justify; to text-align: left; ?

Exactly

[Oldpilot]

That works!