النص توسيط باستخدام CSS لا تعمل في أي
-
09-06-2019 - |
سؤال
أواجه مشاكل في الحصول على النص داخل الجدول تظهر تركزت في IE.
في فايرفوكس 2 ، 3 و سفاري كل شيء يعمل بشكل جيد, ولكن لسبب ما, النص لا يظهر تركزت في IE 6 أو 7.
أنا باستخدام:
h2 {
font: 300 12px "Helvetica", serif;
text-align: center;
text-transform: uppercase;
}
لقد حاولت أيضا إضافة margin-left:auto;
, margin-right:auto
و position:relative;
ولكن دون جدوى.
المحلول
خلية الجدول يحتاج text-align:مركز.
نصائح أخرى
CSS text-align الملكية يجب أن تعلن على العنصر الأصلي وليس عنصر تحاول مركز.أي يستخدم text-align:مركز المنشأة إلى مركز النص.فايرفوكس يستخدم الهامش:0 السيارات و قد أعلنت على عنصر تحاول مركز.
<div style="text-align: center">
<h2 style="margin: 0 auto">Some text</h2>
</div>
قد يكون خطأ مطبعي ولكن كنت في عداد المفقودين منقوطة هنا:
margin-left:auto; margin-right:auto position:relative;
يجب أن تكون:
margin-left:auto; margin-right:auto; position:relative;
إذا كان هذا لا يعمل, تأكد من أن العنصر الذي تحاول مركز النص على بعض العرض.حاول وضع العرض إلى 100% و أرى إذا كان هناك أي تغييرات.
على text-align: center
ينبغي أن تكون كافية بما أنك توسيط النص داخل كتلة العنصر (h2) - ضبط هوامش تغيير موقف كتلة النص.
أنا أتساءل عما إذا كان فقط أي هو وجود دمية-البصاق في ذلك font
إعلان لديك هناك ؟
استخدام مواءمة النصوص:مركز div/td الذي يحيط h2.
<table style = "width:400px;border:solid 1px;">
<tr>
<td style = "text-align:center;"><h2>hi</h2></td>
</tr>
</table>
تحرير:واو ستاكوفيرفلوو المجتمع هو سريع جدا!
إذا كنت ترغب في استخدام flexbox ، يمكنك استخدام التالية كذلك.
display: flex;
justify-content: center;
align-items:center