Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > Рамка для текста


Автор: Artemon 3.8.2008, 19:53
на сайте tor74.ru
на главной странице центральный текст обрамлен рамкой в виде прямоугольника с разрывами по вертикали.

сейчас эта рамка сделана с помощью таблицы:

Код

<table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
            <td class="MainBorder_20">
            </td>
            <td class="MainBorder_21" style="width: 70%;">
            </td>
            <td class="MainBorder_23">
            </td>
            <td>
            </td>
        </tr>
        <tr>
            <td class="MainBorder_19">
            </td>
            <td style="width: 70%;">
             [color=red]ЗДЕСЬ КОНТЕНТ[/color]
            </td>
            <td class="MainBorder_22">
            </td>
            <td>
                [color=red]ЗДЕСЬ КОНТЕНТ[/color]
            </td>
        </tr>
        <tr>
            <td class="MainBorder_24">
            </td>
            <td style="width: 70%;">
            </td>
            <td class="MainBorder_24">
            </td>
            <td>
            </td>
        </tr>
        <tr>
            <td class="MainBorder_25">
            </td>
            <td class="MainBorder_21" style="width: 70%;">
            </td>
            <td class="MainBorder_26">
            </td>
            <td>
            </td>
        </tr>
    </table>


Проблема в том что рамка с низу не прилегает к нижней строке текста, это и понятно, ведь нижняя рамка в другой ячейки таблицы.
Как грамотно оганизовать подобную рамку вокруг текста ?

Автор: webster 3.8.2008, 21:21
Самым простым и эффективным было бы сделать четыре вложенных дива и к каждому прикрепить бэкгроундную картинку, соотвестсвующую каждому из четырех углов:
Код

<div class="topright">
<div class="topleft">
<div class="bottomright">
<div class="bottomleft">
Почему он используется?Давно выяснено, что при оценке дизайна и композиции читаемый текст мешает сосредоточиться. Lorem Ipsum используют потому, что тот обеспечивает более или менее стандартное заполнение шаблона, а также реальное распределение букв и пробелов в абзацах, которое не получается при простой дубликации "Здесь ваш текст.. 
</div>
</div>
</div>
</div>

Автор: Artemon 4.8.2008, 17:35
Как всегда, Спасибо за идею!

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)