Добавление цвета фона и заполнения строки в загрузчике Twitter

Я понимаю, что отступы в Twitter Bootstrap были доведены до отчаяния, и раньше мне удавалось добиться этого в определенной степени, но в настоящее время я застрял в попытке заставить мои три span4столбца красиво сидеть на заполненной белой фоновой строке.

Я пробовал различные способы добавления дополнительного, несемантического div, но безрезультатно.

Я пробовал:

<div id="mydiv">

            <div class="wrap">

                <div class="row">

                    <div class="span4">
                        <ul>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                        </ul>
                    </div> <!--.span4 -->

                    <div class="span4">
                        <ul>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                        </ul>
                    </div> <!--.span4 -->

                    <div class="span4">
                        <ul>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                        </ul>
                    </div> <!--.span4 -->

                </div> <!--.row -->

            </div> <!-- wrap -->

        </div> <!-- mydiv -->

А также:

<div id="mydiv" class="row">

            <div class="wrap">

                    <div class="span4">
                        <ul>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                        </ul>
                    </div> <!--.span4 -->

                    <div class="span4">
                        <ul>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                        </ul>
                    </div> <!--.span4 -->

                    <div class="span4">
                        <ul>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                            <li>Random link</li>
                        </ul>
                    </div> <!--.span4 -->

            </div> <!-- wrap -->

        </div> <!-- mydiv -->

Раздел "wrap" имеет следующий CSS:

.wrap {
padding: 35px;
background-color: #F7F7F7;
border: 1px solid #DDD;

}

Но каждый раз строка либо перемещается на следующую строку, либо вообще не оборачивает содержимое.

Раньше мне удавалось добавить отступы, используя несемантическую divпосле строки, но на этот раз, похоже, это не работает.

Может ли кто-нибудь указать мне в правильном направлении?

Спасибо.

10
задан onjegolders 31 July 2012 в 12:07
поделиться