سوال: مشکل چیدمان در بوت استرپ [بایگانی]

پیام حیاتی

سه شنبه 01 دی 1394, 17:49 عصر

سلام
در بوت استرپ اجزاء در کلاس container قرار دارند و از ستون های col-md که در row قرار می گیرن استفاده می کنم ، اما حالت زیر رو نتونستم درست کنم :

137596

mohammad425

سه شنبه 01 دی 1394, 18:19 عصر

سلام
دقیقا کجا مشکل دارید؟
اگه میخواین به شکل اون طرحتون بشه باید این کد رو بنویسید:

<div class="container">
<div class="row">
<div class="col-md-4">
sidebar
</div>
<div class="col-md-8">
content
</div>
</div>
</div>

پیام حیاتی

سه شنبه 01 دی 1394, 19:12 عصر

<div class="container">

<div class="row">
<div class="col-md-4" style="background-color:#00F">
sidebar
</div>

<div class="col-md-6" style="background-color:#0CF">
content<br />
Dasdasdsa<br />
Dasdasdsa<br />
Dasdasdsa<br />

</div>
</div>

<div class="row">
<div class="col-md-1" style="background-color:#C30">
sidebar
</div>
</div>

</div>

137600

mohammad425

سه شنبه 01 دی 1394, 20:05 عصر

آهان, برای خود col ها نباید چیزی تعریف کنید, یه دایو دیگه توی اون ها بسازید و رنگ ها رو به اون ها بدین, به این شکل:

<div class="container">

<div class="row">
<div class="col-md-4">
<div class="content" style="background-color:#00F">

sidebar
</div>
</div>

<div class="col-md-6">
<div class="content" style="background-color:#0CF">
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
</div>
</div>
</div>

<div class="row">
<div class="col-md-1">
<div class="content" style="background-color:#C30">
sidebar
</div>
</div>
</div>

</div>

پیام حیاتی

سه شنبه 01 دی 1394, 20:49 عصر

فاصله ایجاد شده رو چطور باید از بین ببریم؟در قسمت content با افزایش متن فاصله sidebar قرمز زیاد میشه.

mohammad425

سه شنبه 01 دی 1394, 21:38 عصر

من تست کردم فاصله ای ایجاد نمیشه:
137602

پیام حیاتی

چهارشنبه 02 دی 1394, 06:33 صبح

عرض کردم قسمت content شما قسمت sidebar را پر کردید ب همین شکل قسمت content رو پر کنید متوجه میشید

mohammad425

چهارشنبه 02 دی 1394, 14:11 عصر

باید داخل col-m-4 کلاس row رو ایجاد کنید:

<div class="container">

<div class="row">
<div class="col-md-4">
<div class="content" style="background-color:#00F">

sidebar
</div>
<div class="row">
<div class="col-md-6">
<div class="content" style="background-color:#C30">
sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar sidebar
</div>
</div>
</div>
</div>

<div class="col-md-6">
<div class="content" style="background-color:#0CF">
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsa
content
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsacontent
Dasdasdsa
Dasdasdsa
Dasdasdsa
</div>
</div>
</div>

</div>

پیام حیاتی

چهارشنبه 02 دی 1394, 16:21 عصر

به نظرم استفاده از بوت استرپ در کدنویسی با حجم زیاد و طراحی های مشکل ، کار را در مراحل پیاده سازی و پشتیبانی پیچیده می کنه اما در کارهای با حجم کم کاربردی هست.