Quote:
Originally Posted by rubeus
Hi, thanks for showing more postings, but at least i'm too dumb to ust mirror the L from the left side to the right side. Can some enlighten me, please?
First section in the appendix is the original solution, second my try.
|
Well, one way to get what you want is:
1. In your .css stylesheet use:
Code:
p {
text-align: justify;
margin: 0;
}
.Box1 {
float: right;
width: 90px; /* width of the vertical part of the "L" + 10px for right margin */
height: 300px; /* height of the image */
}
.Box2 {
float: right;
width: 120px; /* width of the horizontal part of the "L" */
height: 100px; /* height of the horizontal part of the "L" */
}
img.ToRight { /* this class is to align the image toward the right side */
margin: 0;
text-indent: 0;
padding: 0;
float: right;
}
2. In your .xhtml file use:
Code:
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus. Donec metus ligula, elementum at pellentesque pellentesque, suscipit ac nunc. Sed at velit nisl.</p>
<div class="Box1"><img class="ToRight" alt="" height="300" src="../Images/UpsideL.png" width="200" /></div>
<div class="Box2"></div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus.</p>
Below you can see a screenshot of my ADE:
I also attach the respective .epub
Regards
Rubén