add several minor tweeks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-01-20 17:17:06 +04:00
parent 3e391e615b
commit e799ce0248
2 changed files with 19 additions and 9 deletions

View File

@ -1,14 +1,22 @@
/* all elements that will behave like a page */ /* all elements that will behave like a page */
.cover, .page { .cover, .page {
width: 200px; /* XXX make this browser-sized... */
height: 150px;
display: inline-block; display: inline-block;
vertical-align: bottom; vertical-align: bottom;
border: solid blue 1px; overflow: auto;
font-size: 12px /* XXX need these to be the same as the magazine, for some reason does not work...
* one way to go is to use a fixed page layout and scale things manually.
*/
width: 400px;
height: 300px;
font-size: 12px;
border: solid blue 1px;
} }
@ -16,13 +24,15 @@
.magazine { .magazine {
/* this makes the magazine behave like a ribbon */ /* this makes the magazine behave like a ribbon */
width: auto; width: 100%;
height: 100%;
overflow: visible; overflow: visible;
white-space: nowrap; white-space: nowrap;
font-size: 0px; font-size: 0px;
/* default styles */
background: gray; background: gray;
border: solid blue 1px;
} }
.magazine > .cover { .magazine > .cover {

View File

@ -25,9 +25,6 @@
<div class="page"> <div class="page">
Page Page
</div> </div>
<div class="page">
Page
</div>
</div> </div>
<div class="article"> <div class="article">
<div class="cover"> <div class="cover">
@ -46,6 +43,9 @@
<div class="page"> <div class="page">
Page Page
</div> </div>
<div class="page">
Page
</div>
</div> </div>
<div class="article"> <div class="article">
<div class="cover"> <div class="cover">