Margins being ignored

Azzura · 06-05-2012, 12:41 PM

I seem to be having trouble getting left margins to work.

It will indent my whole paragraph but the value does nothing - it seems to pick 1 em no matter what value I give it....2em or 30px etc. It is to set off written letters in the text and then a further indent for signing

.letter {
margin-left: 2em;
}

.signed {
margin-left: 4em;
}

In a browser everything looks good - but once in a reader the format is gone. I should just go back to       - less headaches!

DiapDealer · 06-05-2012, 01:22 PM

What are you using to build/compile your MOBI?

First off... there are no "real" margins in the MOBI format. Left margins are simulated using the blockquote element. The blockquotes can be nested to obtain "deeper" left margins.

So in the process of building your MOBI from the html/css source, the margin-left css property is simply being converted to blockquote elements in the MOBI's internal markup code.

The best way of being able to control the depths of your margins is to completely forego the css left-margin approach and just start with the blockquotes (nested if need be) to begin with. They're going to end up that way in the final MOBI anyway.
(and yes, those blockquotes will render different indent "depths" on different devices/apps)

Azzura · 06-05-2012, 02:14 PM

Dreamweaver - Notepad - Mobipocket (just to make the opf base file) - Kindlegen

I have just started using CSS for my ebooks - I just normally tweaked code and nudged when needed - using good ole reliable  

I will mess with blockquotes...see if that helps! Thanks

HarryT · 06-07-2012, 02:50 AM

Mobi does not understand CSS. The various conversion tools will make an attempt to convert CSS into things that Mobi can understand, but it's a hit and miss process. You're a lot better off using proper Mobi tags in the first place.

Eg, to indent a paragraph by 2em:

Code:

<p width="2em">

Oldpilot · 06-11-2012, 05:26 AM

I have begun to use CSS almost exclusively to build Kindle books. This for example for blockquotes:

p.blockquote {
text-indent:0;
margin-left:2em;
font-family:monospace;
}

Perhaps the OP need only get rid of the space between margin-left: and the numeral?

I hasten to add that I know nothing about CSS. I just copy others' styles and test that they work in Fire, Kindle, and iPhone app.

06-05-2012, 12:41 PM	#1
Azzura Junior Member Posts: 2 Karma: 10 Join Date: Jun 2012 Device: Kindle	Margins being ignored I seem to be having trouble getting left margins to work. It will indent my whole paragraph but the value does nothing - it seems to pick 1 em no matter what value I give it....2em or 30px etc. It is to set off written letters in the text and then a further indent for signing .letter { margin-left: 2em; } .signed { margin-left: 4em; } In a browser everything looks good - but once in a reader the format is gone. I should just go back to       - less headaches!

06-07-2012, 02:50 AM	#4
HarryT eBook Enthusiast Posts: 85,544 Karma: 93383043 Join Date: Nov 2006 Location: UK Device: Kindle Oasis 2, iPad Pro 10.5", iPhone 6	Mobi does not understand CSS. The various conversion tools will make an attempt to convert CSS into things that Mobi can understand, but it's a hit and miss process. You're a lot better off using proper Mobi tags in the first place. Eg, to indent a paragraph by 2em: Code: <p width="2em">

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Using negative margins	Agama	Conversion	0	03-03-2012 07:29 AM
Margins	Billi	Calibre	22	01-22-2011 04:50 PM
Margins in 6.3	Amalthia	Calibre	19	07-10-2010 08:40 AM
Help with margins	Switch	Calibre	3	04-30-2010 02:53 AM
Margins	cklammer	EPUBReader	0	12-07-2009 02:55 AM

06-05-2012, 01:22 PM	#2
DiapDealer Grand Sorcerer Posts: 27,546 Karma: 193191846 Join Date: Jan 2010 Device: Nexus 7, Kindle Fire HD	What are you using to build/compile your MOBI? First off... there are no "real" margins in the MOBI format. Left margins are simulated using the blockquote element. The blockquotes can be nested to obtain "deeper" left margins. So in the process of building your MOBI from the html/css source, the margin-left css property is simply being converted to blockquote elements in the MOBI's internal markup code. The best way of being able to control the depths of your margins is to completely forego the css left-margin approach and just start with the blockquotes (nested if need be) to begin with. They're going to end up that way in the final MOBI anyway. (and yes, those blockquotes will render different indent "depths" on different devices/apps)

06-05-2012, 02:14 PM	#3
Azzura Junior Member Posts: 2 Karma: 10 Join Date: Jun 2012 Device: Kindle	Dreamweaver - Notepad - Mobipocket (just to make the opf base file) - Kindlegen I have just started using CSS for my ebooks - I just normally tweaked code and nudged when needed - using good ole reliable   I will mess with blockquotes...see if that helps! Thanks

06-11-2012, 05:26 AM	#5
Oldpilot Groupie Posts: 184 Karma: 2572 Join Date: Aug 2010 Device: Kindle	I have begun to use CSS almost exclusively to build Kindle books. This for example for blockquotes: p.blockquote { text-indent:0; margin-left:2em; font-family:monospace; } Perhaps the OP need only get rid of the space between margin-left: and the numeral? I hasten to add that I know nothing about CSS. I just copy others' styles and test that they work in Fire, Kindle, and iPhone app.

Advert

Advert