View Single Post
Old 09-04-2015, 12:11 AM   #1
miz sue
Member
miz sue began at the beginning.
 
Posts: 20
Karma: 10
Join Date: Sep 2011
Device: Sony PRS650
Aligning Images and Text Horizontally

Hello!

Can someone show me what I'm doing wrong?!? I'm working on an epub and I need to align "image, text, image" horizontally so they stay aligned when the font size changes in the device.

My html is:

<div id="bigbox">
<div class="textbox">
<img src="images/c1.jpg" class="imageleft" alt="Image"/></p>
<img src="images/c2.jpg" class="imageright" alt="Image"/></p>
<p class="noindentt">George Washington was the first president of our country.<br/><b>Don’t you believe it</b>.</p>
</div>
</div>

My css is:

#bigbox
{
margin-right:0em;
margin-left:0em;
margin-top:0.7em;
margin-bottom:2.5em;
padding-right:1.5em;
padding-left:1.5em;
border-color:#EF3F35;
}
.textbox
{
display: inline-block;
}
.imageleft
{
float:left;
}
.imageright
{
float:right;
}
.noindentt
{
clear:both;
margin-top:-4em;
font-size:1em;
margin-left:2em;
margin-right:2em;
text-align:justify;
margin-bottom:0em;
}

Bigbox is perfect and works fine but I can't get Textbox to fit. The images are brackets; so its supposed to look like this:

{ znznznznznzn }
znznznzn

but I'm getting:

{ znznznzn
nznznzn }

If anyone can help me, I'd so appreciate the assistance.

Thanks,

Sue
miz sue is offline   Reply With Quote