Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Выровнять DIV по левому краю и сохранить его, ширину 
V
    Опции темы
Royan
Дата 28.10.2008, 01:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Dreamer
***


Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15



Сразу предлагаю пример того что не получилось:

Код

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Пример</title>
    <STYLE type="text/css">
    BODY {
        margin: 15px;
        padding: 15px;
    }
    
    #page {
        height: 600px;
        background-color: #CCCCCC;
    }
    
    #label {
        text-align: right;
        display: block;
        height: 50px;
    }
    
    #text {
        background-color: olive;
        font-size:32px;
    }
    
    </STYLE>
    </head>
    <body>
        <DIV id="page">
            <SPAN id="label"><DIV id="text">haha</DIV></SPAN>
        </DIV>
    </body>
</html>


Как видно DIV прекрасно выровнен по левому краю, вернее даже текст внутри DIV'а, а сам DIV имеет ширину 100% своего контейнера, т.е. 600px. Хотелось бы выровнять DIV относительно левой границы контейнера причем так чтобы его ширина ровнялась ширине находящегося в нем текста, возможно ли это?


--------------------
Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь
PM MAIL MSN   Вверх
webster
Дата 28.10.2008, 09:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 361
Регистрация: 1.1.2007

Репутация: 34
Всего: 34



Код

#page {
float: left;
}
А следующему за ним БЛОЧНОМУ элементу присвоить clear: both;
Или же вставить дополнительный элемент сразу же после #page:
Код

<br style="height: 0; clear: both;" />

Или же вставить сразу же после #page:
Код

<div style="clear: both; height: 1px; font-size: 1px; line-height: 0px; margin-bottom: -1px; overflow: hidden;"></div>

PM MAIL   Вверх
Royan
Дата 30.10.2008, 04:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Dreamer
***


Профиль
Группа: Участник Клуба
Сообщений: 1708
Регистрация: 14.9.2002
Где: Лондон

Репутация: нет
Всего: 15



webster, Понял спасибо за совет!


--------------------
Открыта вакансия Junior Java Developer'а в нашем лондонском офисе, подробнее можно узнать здесь
PM MAIL MSN   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.3635 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.