Class: .own-size: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
|||
Line 16: | Line 16: | ||
width:700px; | width:700px; | ||
height:600px | height:600px | ||
} | |||
#flipbook .page-wrapper{ | |||
-webkit-perspective:2000px; | |||
-moz-perspective: 2000px; | |||
-ms-perspective: 2000px; | |||
perspective: 2000px; | |||
} | } | ||
Revision as of 04:54, 19 July 2012
Customizes the size of a page. The CSS rules width and height can be added directly to the page selector or using the style parameter. For example:
<div id="flipbook"> <div>Page 1 with default size</div> <div class="own-size" style="width:100; height:100px;"> Page 2 with own size </div> </div>
Using CSS
#flipbook { width:700px; height:600px } #flipbook .page-wrapper{ -webkit-perspective:2000px; -moz-perspective: 2000px; -ms-perspective: 2000px; perspective: 2000px; } #flipbook .p2, #flipbook .p3{ width:300px; height:500px; }
<div id="flipbook"> <div class="fixed hard">Page 1 with default size</div> <div class="own-size"> Page 2 with own size </div> <div class="own-size"> Page 2 with own size </div> </div>
In this sample the 1st page will have a size of 350x600, meanwhile page 2 and 3 the customized size. Notice that the first page uses the classes fixed and hard.
<yambe:breadcrumb>Turn CSS</yambe:breadcrumb>