我问的第一个问题!
目前正在构建一个页面,使用Flexbox并排展示一本书的摘录及其翻译.
目标语言是阿拉伯语.
在我目前正在处理的示例中,我似乎无法使这两个框项目具有相同的宽度……
似乎是阿拉伯语的使用打破了平衡.如何才能使第二个框项目获得框元素的50%?
我试图将框项目的宽度调整为自动,但似乎使每个框的宽度根据字符的数量而有所不同. 我try 了宽度:100%,但没有任何成功.
Here is an example with Arabic个
Here is an example with Latin alphabet个
<body>
<div class="translation">
<div class="lang">
<h3 class="lang-name">Français</h3>
<p class="extract">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget tellus tempus, eleifend est a, commodo leo. Morbi mattis neque at magna malesuada semper sit amet ut ex. Curabitur facilisis, tortor sit amet vehicula vulputate, risus purus malesuada est, vel laoreet nisi tortor vel dui. Fusce accumsan nisl vel placerat semper. Vivamus id quam vel sapien aliquam semper. Morbi elementum lacinia neque, ullamcorper sodales sem bibendum vel. Vivamus eu volutpat erat.
<br>Duis et convallis eros, id porta eros. Fusce at finibus nisl. Nulla in dictum neque. Suspendisse sed dui in nibh luctus mollis. Curabitur pharetra dapibus risus nec accumsan. Maecenas tincidunt eget nunc sed pellentesque. Nunc ante arcu, dictum sed odio in, cursus semper est. Cras fermentum, ante vitae aliquet faucibus, odio mi dapibus felis, vel placerat dolor nulla et est.
</p>
</div>
<div class="lang">
<h3 class="lang-name">Arabe</h3>
<p class="extract ar">ينتهي السفر في جو ساكن إلى حد ما. لا يتكلم كثيرا الرجلان الجالسان في المقدمة. و الذين في المؤخرة مجتهدون فينكبون على المطالعة أو يلعبون لعبة الإحاجي حسب المناظر التي تتتابع أمام عيونهم. فكان النهار جميلا لكنه يبدأ يمحي قليلا قليلا عند وصولهم إلى مدينة ڤان. و يبقى أقل من ساعة قبل وقوف السيارة أمام منزلهم. سيصلون عند المغيب و هذا طريق جيد لإنهاء النهار بشكل رائع و لإزالة التوترات.
<br>
فلما سلكوا الطريق الذي يحاذي ساحل المحيط في المؤخرة ليس هناك ولد واحد فقط بل ولدان مفتونان بالمنظر و يتأثران بهذا المنظر الساحر الذي يرؤونه للمرة الأولى وفي عيونهم وهوج برتقالية تشبه أضواء النفق بشكل مستمر و بشكل أفضل أيضا. بعيدا من نفق يقدم المحيط نفسه لهم. لما ركن پول السيارة جولي تشعر أنها في حلم فتلمح أن الشاطئ قريب في الخلف و قد سمعت هدير الأمواج.
</p>
</div>
</div> </div>
</article>
</body>```