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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Вировнять по центру, теория 
:(
    Опции темы
Zorak
Дата 6.6.2008, 15:09 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



Чисто теоретический вопрос... вот вировнял box по центру страници
Код

#wrapper {
    margin:10px;
    border:1px solid blue;
    height:100%;
    padding:10px;
    width:500px;
        float:left;
    position:absolute;
    left:50%;
    margin-left:-25%;
}

тепер я не понимаю, как ето так получилось ??? первых 5 строк знаю.... написал, остальные не понял.... а в последнем вообще почему мне стрельнуло в голову написать "-25%", а не "25%", даже не понимаю... поясните пжлста мой же код)...


--------------------
Знание - сила. А сила есть, ума не надо...
Занимаюсь интернет бизнесом и ищу новых партнеров. Кому интересно - обращайтесь в ЛС, скайп или мыло.
PM MAIL ICQ   Вверх
NDenis
Дата 6.6.2008, 15:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



центрирование по горизонтали с помощью абсолютного позиционирования
left:50% - отодвигаем левую границу блока к середине окна браузера, но не самого блока ;)
margin-left: -25% - а вот это как раз исправление выше описанного.
PM MAIL   Вверх
Zorak
Дата 6.6.2008, 17:29 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



Цитата(NDenis @ 6.6.2008,  15:16)
margin-left: -25% - а вот это как раз исправление выше описанного.

в смисле исправление ?)


--------------------
Знание - сила. А сила есть, ума не надо...
Занимаюсь интернет бизнесом и ищу новых партнеров. Кому интересно - обращайтесь в ЛС, скайп или мыло.
PM MAIL ICQ   Вверх
bars80080
Дата 6.6.2008, 17:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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



в смыле ты отодвинул слой от левого края на 50% (left: 50%), а затем на 25% откатил назад к левому краю
PM MAIL WWW   Вверх
Zorak
Дата 6.6.2008, 18:07 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



Цитата(bars80080 @ 6.6.2008,  17:36)
в смыле ты отодвинул слой от левого края на 50% (left: 50%), а затем на 25% откатил назад к левому краю

зачем ??? не проще в таком случае былоб left:25% ???


--------------------
Знание - сила. А сила есть, ума не надо...
Занимаюсь интернет бизнесом и ищу новых партнеров. Кому интересно - обращайтесь в ЛС, скайп или мыло.
PM MAIL ICQ   Вверх
bars80080
Дата 6.6.2008, 18:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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



ну, это тебя надо спросить, что это у тебя нагорожено. я лично не вижу причин так писать

но причина конечно может быть, скажем авторский замысел. а чей? вроде твой
PM MAIL WWW   Вверх
lukas
Дата 6.6.2008, 18:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



лучше писать так...

Код

margin: 0 auto;


и твой слой будет по центру...


--------------------
http://code.google.com/p/orionphp/ - opensource скриптовой язык Orion (аналог PHP) для freepascal/delphi.
PM MAIL WWW   Вверх
Zorak
Дата 6.6.2008, 22:47 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


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

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



Да, добрал шва, спасибо)...


--------------------
Знание - сила. А сила есть, ума не надо...
Занимаюсь интернет бизнесом и ищу новых партнеров. Кому интересно - обращайтесь в ЛС, скайп или мыло.
PM MAIL ICQ   Вверх
malkovian
Дата 14.6.2008, 02:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 27
Регистрация: 20.5.2008
Где: Киев/Orgrimmar

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



Код


#wrapper {
    margin:10px;
    border:1px solid blue;
    height:100%;
    padding:10px;
    width:500px;
        float:left;
    position:absolute;
    left:50%;
    margin-left:-25%;
}


а к чему float:left к выравниванию по центру?
PM MAIL ICQ   Вверх
SelenIT
Дата 14.6.2008, 15:00 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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



malkovian, ни к чему, это ошибка, которую забыли убрать. Конечно, при position:absolute float не действует и действовать не может.
Цитата(Zorak @  6.6.2008,  18:07 Найти цитируемый пост)
зачем ??? не проще в таком случае былоб left:25% ???

Проще, но эффект центрирования был бы только при ширине окна 1000px smile. Как и сейчас, впрочем. Вот margin-left:-250px (на половину width) дало бы центрирование везде (при фиксированной ширине блока, как тут), но на очень маленьком экране левый край блока просто уходил бы за экран без возможности его прочитать хоть как-либо.

Цитата(lukas @  6.6.2008,  18:18 Найти цитируемый пост)
лучше писать так...
Код

margin: 0 auto;
и твой слой будет по центру...

Да, только для надежной работы этого нужен Standards-режим рендеринга (корректный доктайп по-простому). 5-й IE пролетает, но туды ему и дорога ;)

А вот для вертикального центрирования подобный прием достаточно успешно применяется.


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




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


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

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