View Full Version : Question about ADE


crutledge
04-14-2013, 02:14 PM
I have the following definition in the CSS:

.centerbox{
width:50%;
padding:10px
font-size : 90%;
margin-left:auto;
margin-right:auto;
margin-bottom:1em;
}

It displays properly centered on the page in Sigi, Calibre ePub reader, Kindle, and Sony but in ADE it is left justified. See attached images.

Is this a problem with ADE or have I missed something?

Thanks

Terisa de morgan
04-14-2013, 02:51 PM
Where is the alignment in that definition?

I mean, for alignment I think you need:

text-alignment: center;

crutledge
04-14-2013, 02:58 PM
Where is the alignment in that definition?

I mean, for alignment I think you need:

text-alignment: center;

I don't wish to center the text - only the block.

PeterT
04-14-2013, 03:08 PM
Faulty css ? Missing ; on

padding:10px

Jellby
04-14-2013, 03:12 PM
.centerbox{
margin-left:auto;
margin-right:auto;
}

That's the part that's centering the block, and the part that doesn't work in ADE, because, according to the ePub spec:

"Reading Systems may set the value of any margin property whose specified value is auto to 0."

and it seems ADE just chooses to do that, there's not much we can do.

But, since you are using a relative width, anyway (width:50%), you can get the desired effect with:

margin-left:25%;
margin-right:25%;

(actually, I'm surprised it works in the Sony, which version is it?)

sellew
04-14-2013, 03:14 PM
I have the following definition in the CSS:

.centerbox{
width:50%;
padding:10px;
font-size : 90%;
margin-left:auto;
margin-right:auto;
margin-bottom:1em;
}

It displays properly centered on the page in Sigi, Calibre ePub reader, Kindle, and Sony but in ADE it is left justified. See attached images.

Is this a problem with ADE or have I missed something?

Thanks

Please note there is a semicolon missing in the 3rd line of your code. ADE will ignore the rest of the stylesheet if it finds any tiny error or mistype.

crutledge
04-14-2013, 04:45 PM
That's the part that's centering the block, and the part that doesn't work in ADE, because, according to the ePub spec:

"Reading Systems may set the value of any margin property whose specified value is auto to 0."

and it seems ADE just chooses to do that, there's not much we can do.

But, since you are using a relative width, anyway (width:50%), you can get the desired effect with:

margin-left:25%;
margin-right:25%;

(actually, I'm surprised it works in the Sony, which version is it?)

That did it. Thanks very much.

Charlie

Toxaris
04-15-2013, 03:11 AM
You can also use this:

.center{text-align: center;}
.centerbox{width:50%; padding:10px font-size : 90%; margin-bottom:1em; }

<div class="center"><p class="centerbox">This text will be left-aligned, but centered in a block.</p></div>