MobileRead Forums - View Single Post

Arkadian · 09-12-2014, 06:10 AM

I have defined a text box like this:

Code:

<style> 
div.box1 {
  width: 20em;  
    background-color:#D1D3D4;
	border-bottom: 3px double;
	border-top: 3px double;
	border-left: 3px double;
	border-right: 3px double;
	padding: 1em;
  margin-top: 1em;
	line-height: 1.7em;
	text-align: center;
    float: right;
}
</style>


  <div class="box1">Yadda, yadda, yadda, yadda, yadda, yadda.</div>
  <div style="clear:both;"></div>

which works fine and looks pretty. Is there a way to stop the box from being divided between two pages if it happens to be at the end of a page?

In the editor it always looks fine, but then when I look at the book on my iPad using iBooks, that's when I see the problem.

09-12-2014, 06:10 AM	#1
Arkadian Connoisseur Posts: 96 Karma: 10 Join Date: Mar 2014 Device: none	Box divided between two pages I have defined a text box like this: Code: <style> div.box1 { width: 20em; background-color:#D1D3D4; border-bottom: 3px double; border-top: 3px double; border-left: 3px double; border-right: 3px double; padding: 1em; margin-top: 1em; line-height: 1.7em; text-align: center; float: right; } </style> <div class="box1">Yadda, yadda, yadda, yadda, yadda, yadda.</div> <div style="clear:both;"></div> which works fine and looks pretty. Is there a way to stop the box from being divided between two pages if it happens to be at the end of a page? In the editor it always looks fine, but then when I look at the book on my iPad using iBooks, that's when I see the problem.