Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.08.2013, 11:23
Аспирант
Отправить личное сообщение для Petja Посмотреть профиль Найти все сообщения от Petja
 
Регистрация: 13.03.2011
Сообщений: 57

Если position absolute, а внутри margin в % - то перенос на другую строку...
Если контейнер position absolute, а внутри него идут элементы float друг за другом в строчку, и если внутреннему элементу задать margin или padding (right или left) - то последний элемент съезжает на новую строку...

Получается, что внутренние элементы float создают общую ширину блока absolut (как они ее создают?), а margin-right почему-то не участвует в создании ширины (почему?) а перевешивает 100% ширину и выходит за ее рамки.

Подскажите, пожалуйста, какая логика за этим всем стоит? Что почитать?

Вот код http://jsfiddle.net/Axjvd/5/

<ul class="mainMenu">
    <li><a href="">Цены</a></li>
    <li><a href="">Заказать</a></li>
    <li><a href="">Услуги</a></li>
    <li><a href="">Продвижение</a></li>
    <li><a href="">Портфолио</a></li>
    <!-- Причем не важно сколько пунктов, последний всегда переносится! -->
    <!--<li><a href="">Цены</a></li>
    <li><a href="">Заказать</a></li>
    <li><a href="">Услуги</a></li>
    <li><a href="">Продвижение</a></li>
    <li><a href="">Портфолио</a></li>-->
</ul>

<style type="text/css">
    .mainMenu{
        height: 40px;
        list-style: none;
        background-color: #0f0;
        position: absolute; /* Если position = absolute */
    }
    li{
        float: left;
        margin-right: 4%; /* Из-за него переносится на другую строку */
        /*padding-right: 4%; Так тоже самое будет */
    }
    a{
        display: block;
        height: 31px;
        padding: 9px 10px 0;
    }
</style>
Ответить с цитированием
  #2 (permalink)  
Старый 03.08.2013, 12:48
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Petja
margin-right почему-то не участвует в создании ширины (почему?)
Ну помоему очевидно почему. Для расчета ширины контейнера рассчитывается ширина содержимого. При этом встречается процентное значение, которое можно рассчитать только зная ширину контейнера. Получаем рекурсию. Чтобы избежать рекурсию расчет процентного значения откладывается. Таким образом в ширину контейнера не закладываются процентные поля.
Если бы процентные значения не игнорировались, то ширина контейнера оказалась бы равна бесконечности.
Ответить с цитированием
  #3 (permalink)  
Старый 03.08.2013, 18:56
Аспирант
Отправить личное сообщение для Petja Посмотреть профиль Найти все сообщения от Petja
 
Регистрация: 13.03.2011
Сообщений: 57

Спасибо, интересно...
А есть ли какая-то возможность задать относительное расстояние между этими блоками внутри абсолютного блока?
Ответить с цитированием
  #4 (permalink)  
Старый 03.08.2013, 19:26
Аспирант
Отправить личное сообщение для Petja Посмотреть профиль Найти все сообщения от Petja
 
Регистрация: 13.03.2011
Сообщений: 57

Сори, кажется понял теперь что нельзя.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Оцените, пожалуйста код вёрстки OlegALL Ваши сайты и скрипты 18 26.07.2011 08:35
Водяной знак на fancybox bobrina Общие вопросы Javascript 1 03.06.2011 20:11