Previous Message
Next Message

Parallel texts

Sent by Ed Seehouse on 15 March 2006 19:07


On 3/15/06, Lars Bruzelius [EMAIL-REMOVED]> wrote:
> For a transcription that I am doing, I need syncronised parallel
> texts with a dividing line running down the gutter. If I understand
> the CSS box model correctly, the following CSS would do the trick:
>
> <style type="text/css">
> .l {float: left; width: 49.1%; padding-right: 0.1%}
> .r {float: right; width: 49.1%; padding-left: 0.1%}
> </style>

Use "float:left" on all your divs:

> <style type="text/css">
> .l {float: left; width: 49.1%; padding-right: 0.1%}
> .r {float: left; width: 49.1%; padding-left: 0.1%}
> </style>

Better still make them all the same class.


> <div style="width: 100%">
> <div class="l">Short text</div>
> <div class="r">Long text</div>
> <div class="l">More text</div>
> <div class="r">Yet more text</div>
> </div>
>
> This works as expected in Amaya 9.4 and Internet Explorer 7 Beta 2
> (actually an updated Beta 1), but not in Firefox 1.5.0.1 and Opera
> 8.52, where there is no gap below the shorter text.
>
> Adding "border-right: 1px solid black; margin-left: -1px" and
> "border-left: 1px solid black; margin-left: -1px" to the classes "l"
> and "r" respectively once again gives the expected result in Amaya
> and Internet Explorer. Opera and Firefox still exhibit the previous
> "defects", but Opera also has a gap between the borders.
>
> Where have I gone wrong? With the reputation of Opera and Firefox, I
> expect these to render the code correctly and Amaya and Internet
> Explorer to fail rather than the other way around.
>
> <URL:"http://www.forumnavale.se/test(div).html">
>
>
> Lars Bruzelius
>
> SYSteam Udac AB
> Box 174,
> SE-751 04  Uppsala,
> Sweden.
>
> Telephone: +46 18 678054    E-mail: [EMAIL-REMOVED]
> Telefax:   +46 18 516600    <URL:"http://www.udac.se">
>
> ______________________________________________________________________
> css-discuss [EMAIL-REMOVED]]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>


--
Ed Seedhouse
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread:

Possibly related: