Quote:
Originally Posted by orange!
This isn't really a Sigil question--if there's a better place to ask generic CSS questions, please let me know.
The book I'm working on uses a short horizontal line to separate sections within a chapter. So my inclination was to use this in my html:
and this in my stylesheet:
Code:
hr.sep
{
width: 72px;
text-align: center;
}
Looks fine in Book Preview, but on the device, the <hr> is left-aligned.
My question: is there an industry-standard way to render a section separator like this?
Thanks in advance!
|
In devices based on ADE, the text-align property doesn't work for the <hr> tag. So, you must use a workaround to center the rule. First, work with percentages to fix the rule width (72px is about 12% of the device width); knowing that and that you want to center the rule, you need to establish a left margin of (100% - 12%) / 2 = 44%. Of that way, in your css stylesheet you should use the following code:
Code:
hr.sep
{
width: 12%;
margin-left: 44%;
}
After that you should have your rule centered in your device
Regards
Rubén