09-14-2014, 07:09 PM | #1 |
Member
Posts: 11
Karma: 10
Join Date: Sep 2014
Device: Kindle
|
Centering images
I want to center a 70px wide image inside a span tag which is the default 100% width. I gave the span a class and styled it as
Code:
text-align:center Can anyone suggest what is going on? |
09-14-2014, 07:23 PM | #2 | |
null operator (he/him)
Posts: 20,587
Karma: 26954694
Join Date: Mar 2012
Location: Sydney Australia
Device: none
|
Quote:
BR |
|
Advert | |
|
09-14-2014, 10:29 PM | #3 |
creator of calibre
Posts: 43,867
Karma: 22666666
Join Date: Oct 2006
Location: Mumbai, India
Device: Various
|
Convert it to AZW3, not MOBI. MOBI is an obsolete format. If you do want it centered in MOBI you will need to put it in a <div> tag, not a <span> tag.
|
09-15-2014, 11:05 AM | #4 |
Wizard
Posts: 1,613
Karma: 6718479
Join Date: Dec 2004
Location: Paradise (Key West, FL)
Device: Current:Surface Go & Kindle 3 - Retired: DellV8p, Clie UX50, ...
|
If you must use a <SPAN> do as Kovid instructs and use AZW3 instead of the old MOBI format.
If you must use the old MOBI then you need to place the image in <P> or <DIV> instead of a <SPAN>. If you do, it will center. The old MOBI is a good format, but is based on an earlier and simpler version of HTML and doesn't support many of the newfangled fancy HTML/CSS tricks. |
09-16-2014, 12:22 PM | #5 |
Resident Curmudgeon
Posts: 74,037
Karma: 129333114
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
A <span> tag is bad form even in an ePub or KF8. It may work in whatever software you are using to view it now, but eventually, you'll find some software that it won't work with. Go with the <p> or <div> as has been mentioned as that's proper form.
|
Advert | |
|
09-18-2014, 12:05 AM | #6 |
Member
Posts: 11
Karma: 10
Join Date: Sep 2014
Device: Kindle DX, Kindle Fire HDX 7", iOS (iPhone and iPad)
|
(Warning: I'm an ebook newbie)
I have centered images using the following. Is it bad ebook form? CSS snippit: .ImgCenter { text-align: center; } HTML: <figure class="ImgCenter" > <img alt="IMG" src="../your_image_file.jpg"/> <br /> <figcaption><b>Fig I.II:</b> Description </figcaption> </figure> (I've also tweeked the margin attributes to attach the caption to the image, but that's a bit off-topic.) |
09-19-2014, 09:55 AM | #7 |
Member
Posts: 11
Karma: 10
Join Date: Sep 2014
Device: Kindle
|
|
09-19-2014, 09:56 AM | #8 |
Member
Posts: 11
Karma: 10
Join Date: Sep 2014
Device: Kindle
|
OK got it - thanks!
|
09-19-2014, 10:40 AM | #9 |
Member
Posts: 11
Karma: 10
Join Date: Sep 2014
Device: Kindle DX, Kindle Fire HDX 7", iOS (iPhone and iPad)
|
(Folks can ignore my post... I've played around with centering & now understand the advantages of the <div>.)
|
Tags |
calibre, html, kindle |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
Centering blockquotes | ghostyjack | ePub | 6 | 07-17-2014 06:07 AM |
Nook not centering anything. why? | kateharp | ePub | 0 | 05-11-2011 10:53 PM |
Centering Images using object styles | SamL | ePub | 7 | 04-05-2011 01:28 PM |
How to do centering | sjohnson717 | Calibre | 15 | 02-28-2010 09:20 AM |
centering images with css override? | Amalthia | Calibre | 2 | 03-30-2009 01:53 PM |