CSS "محاذاة" لتحديد المواقع
-
04-07-2019 - |
سؤال
<div>
<h1>Title</h1>
<table>
...
</table>
</div>
والآن، و
<h1>
ويبلغ هامش: 0؛ لذلك هو في الجزء العلوي من شعبة. ذروة شعبة هو 300px.
ولكن أود الجدول لتوضع في الجزء السفلي من شعبة، على سبيل المثال. valign = "القاع" ولكن للجدول بأكمله.
المحلول
وجرب هذا: http://jsbin.com/emoce
وعلى الرغم من انها مشابهة لحل داريل ل. إلا أنني لا أستخدم الموقف: المطلق على شعبة التفاف، ولكن الموقف إلى حد ما:. النسبي لجعل موقف الجدول المطلق إلى أن
نصائح أخرى
وهنا هو ما اقترح ريمي شارب:
<style type="text/css" media="screen">
#container {
position: relative;
margin: 0;
height:300px;
border:1px solid #000;
}
#container h1 {
margin:0;
}
#tableLayout {
position: absolute;
bottom:0;
border: 1px solid #c00;
}
</style>
<div id="container">
<h1>Title</h1>
<table id="tableLayout">
<tr><td>example cell</td></tr>
</table>
</div>
ويبدو أنها تعمل!
ونشرت لي هنا لذلك سوف يكون دائما هنا.
وماذا عن هذا:
<style type="text/css">
#container {
position: absolute;
margin: 0;
height:300px;
border:1px solid #000; }
#container h1 {
margin:0; }
#tableContainer {
position: absolute;
bottom:0; }
</style>
<div id="container">
<h1>Title</h1>
<div id="tableContainer">
<table id="tableLayout">
<tr><td>...</td></tr>
</table>
</div>
</div>
والمشكلة الوحيدة هي أن كلا من شعبة الحاوية وعناصر div tableContainer تحتاج إلى أن تكون مطلقة وضعه. لست متأكدا اذا كان هذا العمل للتخطيط الخاص بك.
لا تنتمي إلى StackOverflow