Время:
Новых сообщений: Нет
Вы на форуме дней
Ваша группа: Гость
Ваш IP: 3.145.56.150
Logical-Portal — молодежный портал со своей изюминкой, каждый сможет найти что-то интересное и полезное для себя, например наш форум общения с которым вам обязательно нужно ознакомиться.
  • Страница 1 из 1
  • 1
Модератор форума: Hawk  
Есть на портале верстальщики? :)
Сообщение оставлено 09.08.2012 в 19:00:12 | Сообщение #1
В общем, сверстал дизайн, у которого хеадер рипитится на всю длину экрана, а врапер имеет определенную ширину и позиционируется по центру. все бы хорошо, но когда я начал ставить логотип у меня получилась фигня, мне нужно его поставить по центру окна браузера, но так, чтобы оно не сдвигалось относительно изменения размера браузера.
Я пробовал засунуть лого в врапер с абсолютным позиционированием, чтобы лого позиционировалось от родительского элемента, т.е. врапера, но тут у меня появилась проблема, когда пытаюсь поставить логотип на его место, он залезает под хеадер, свойство z-index почему-то не работает, очень странно, ведь и врапер и хеадер и лого у меня имеют свойство позишен, только врапер и хеадер относительное позиционирование, а лого абсолютное! В общем у меня не получилось выгнать его на верх, поэтому я вернул его в хеадер и решил его засунуть по центру с помощью margin:0 auto, но и тут меня не все устраивает, ведь при изменении размера окна браузера, логотип движется вместе с ним и смещается, т.е. на маленьких разрешениях экрана будет бред!
Опытные верстальщики, подскажите, как мне засунуть уже это лого в хеадер так, чтобы оно прилепилось в центр и не двигалось, не смотря на манипуляции с окном браузера!
 
 
   
Сообщение оставлено 09.08.2012 в 21:17:32 | Сообщение #2
Я не знаток в верстании,но можно полазить в css стилях наверное...
 
Увидимся...
 
   
Сообщение оставлено 09.08.2012 в 21:28:59 | Сообщение #3
CbIHoK, нужен пример, кинь демо сайт, а лучше заархивь дизайн так, что-бы я его залил и проверил заодно поправлю или просто на локале у себя исправил.

ЗЫ. в ЛС ссылку, в паблик не попадет, думаю ты меня знаешь )
 
   
Сообщение оставлено 14.08.2012 в 10:35:42 | Сообщение #4
не помню какой тег, вроде padding. Попробуй в стиле логотипа прописать так: padding-left:(число)px;padding-right:(число)px;
если нет, то: margin-left:(число)px;margin-right:(число)px;
 
 
   
Сообщение оставлено 15.08.2012 в 20:31:43 | Сообщение #5
Stendy, дааа, а я то не додумался использовать их, ага :D
То, что ты предлагаешь бред, имхо, т.к. чтобы позиционировать с помощью маржина, нужно указать флоат, а там и задается от какой стороны он будет отмерять, райт или лефт, поэтому будет фигня, ибо он будет позиционировать от окна браузера, а если использовать паддинг, то он позиционирует от окна браузера, т.е. если начать изменять размер браузера, логотип будет смещаться и получится бред!
Жду еще предложений.


 Сообщение отредактировал CbIHoK - Среда, 15.08.2012, 20:36:36
 
 
   
Сообщение оставлено 15.08.2012 в 22:17:13 | Сообщение #6
CbIHoK, ты не совсем верно понимаешь, флоат не обязателен для маргин, прост опаддинг внутренний отступ а маргин внешний. так что либо добавляй снаружи блок и позиционируй или внутрь.

а так вообще абсолют.
 
   
Сообщение оставлено 16.08.2012 в 11:03:28 | Сообщение #7
Liiion911, то есть, ты предлагаешь засунуть логотип еще в один див и его сдвигать или что?
UPD: Liiion911, стоп, а можно так, добавить логотип в еще один див, для этого дива добавить ширину в 100% и в процентах, с помощью паддинга сверстать отступы с двух сторон?


 Сообщение отредактировал CbIHoK - Четверг, 16.08.2012, 11:03:58
 
 
   
Сообщение оставлено 17.08.2012 в 15:05:33 | Сообщение #8
<div class="header">
<a href="#" class="hlogo"></a>
</div>
css:
.header { position: relative; }
a.hlogo { position: absolute; left: 50%; margin: 0 0 0 -300px }

Вот этот margin: 0 0 0 -300px выравниваешь уже ты.
Изменяешь 300пх.
 
   
Сообщение оставлено 17.08.2012 в 19:54:05 | Сообщение #9
dream-designs, во спасибо, идеально!!
Можно закрывать ^_^
 
 
   
Сообщение оставлено 15.09.2012 в 15:13:23 | Сообщение #10
Проблема решена, закрыто по просьбе.
 
 
   
  • Страница 1 из 1
  • 1
Поиск:
 
Графика от: Megas, GraFOS | Дизайн сверстал E.A.
Хостинг от uCoz
Яндекс.Метрика