Смещается горизонтальное меню вниз в Opere

Newbie · September 1, 2010

Сделал шапку и горизонтальное меню.

Во всех броузерах (Ghrome,IE,Ffox) отображается как и задумывалось ровно, а в opere смещается вниз

во всех броузерах кроме oпeры:

в опере:

html-код:

 

<body>

   <div id="header-null">
				<div id="header">
						<div id="rosa">	   
						   <h1>Розы</h1>
						   <span>искуственные</span>
						</div> 
			   </div>


				 <div id="navigation">	   
					  <div id="mymenu">
						   <a href="#">Главная</a>
						   <a href="#">Цветы</a>						  
						   <a href="#">Контакты</a>		   
					  </div>	   
				 </div>	  

  </div>


</body>

сss-код:

 

a		 {text-decoration: none}
a:link	{color: #f83a5a}
a:visited {color: #f83a5a}
a:active  {color: #f83a5a}
a:hover   {color: #a0182e}


body {
font: 13px/18px Arial, Helvetica, sans-serif;
margin : 0 0 0 0;
}

/**  шапка **/

#header-null {

	 background:url(background.png)  0 0 repeat-x;  
	 width: 100%;  
	 border: 3px solid blue;	
	 padding-right: 20px;
}

#header  {
	  width : 100%;
	  height : 128px;  
	  float: right;
	  background : url(img/rose.png) no-repeat right top;
	  border: 2px solid yellow;
	  }



#rosa  {
	 padding: 10px;
	 height: 110px;
	 font-size: 120%;
	 color: #fff;
	 margin : 37px 0 0 81px;
}
#rosa h1 {
  font-size: 165%;
  border: 0px solid black;
  margin-bottom: 18px;
}



/** навигация **/

#navigation {
	  background: #ececec;
	  border: 0px solid black;
	  width: 100%;
	  clear: both;
	  margin-top: -17px;
	  }


#mymenu {
	 padding: 5px;
	 border-bottom: 0px solid #b7b7b7;
	 clear : both; 
	 margin-left :190px; 
	 height: 20px;
}

#mymenu a {

	  padding-left: 15px;
	  padding-right: 15px;
	  font-weight: bold;
	  padding-top: 5px;
	  padding-bottom: 7px;
}

#mymenu a:hover {
	  background: #f6f6f6;
}

/** конец навигации**/
/**  и конец шапки **/

Подскажите, пожалуйста, можно ли исправить чтобы не смещалось.

Или, возможно, у меня структурно неправильный подход.

swetlana · September 2, 2010

так сложности Вы сами себе придумываете, сударь.

Делайте проще:

размещайте текст. Информацию. То, за чем на сайт посетитель и приходит.

Дальше уже пляшите от размещённого текста.

Не текст вписываем в рамки, а рамки описываем вокруг текста.

Не будьте дизайнером, будьте человеком.

Вокруг текста можно указать отступы, благодаря которым он не будет сливаться с окружающими элементами и будет удобовоспринимаем практически независимо от того, каким браузером пользователь зайдёт на страничку, и каковы будут его индивидуальные настройки (а ну как он слепой и все буквы в два раза увеличивает?).

Как сделать такое при фиксированной высоте — вот уж действительно сложность, и боюсь, что неразрешимая.

И да, для того, чтобы не указывать фиксированную высоту, а указать отступы от размещённого текста, яваскрипт совсем не нужен. Честно-честно!

Edited September 2, 2010 by swetlana

Newbie · September 2, 2010

Да. Оказалось падингом можно вполне обойтись.

и каковы будут его индивидуальные настройки (а ну как он слепой и все буквы в два раза увеличивает?).
Как сделать такое при фиксированной высоте — вот уж действительно сложность, и боюсь, что неразрешимая.

А где это настраивается, просто хотелось бы понять у чем идет речь. Можно ли эти предпочтения пользователя касательно шрифта настроить в Windows или это касается каких-то специфических компьютеров?

swetlana · September 2, 2010

Для начала:

шрифты живут в операционной системе, и мы на это не всегда можем повлиять. А даже когда и можем — нуегонафикк.

Один и тот же шрифт (по крайней мере одинаково называющийся) в одном и том же браузере в разных ОС может выглядеть по разному. Что, в принципе, и происходит. Через день ко мне в джаббер стучатся новички с криками типа: «АААА!!!!! Я переустановил виндовс, а в этой семёрке у меня все мои сайты расползлись! Какие в некрософте гады!».

Ну да, Verdana в составе Windows 7 заметно шире Верданы, которой комплектовалась Windows XP. А они тот старинный маленький шрифт повпихивали в свои фиксированные размеры, на что-то надеясь видимо.

Далее:

Раз уж так получилось, что в нашем мире от дизайнеров никуда не деться, то надо хотя бы минимизировать их вредное воздействие на наше здоровье.

За что и спасибо разработчикам браузеров, предусмотревшим увеличение размера шрифта или всей страницы (это уж у всех по разному) по нажатию Cmd+«+», и уменьшение по Cmd+«-» (для Linux сочетания Ctrl+«+»/Ctrl+«-», для Windows тоже должны быть аналогичные).

И всё бы здорово, и всем бы счастье, да только в отдельных случаях текст увеличивается, а жёстко ограничивающие его рамки — нет. Что получается?

Правильно: свалка нечитаемого неприличия.

А всё почему? Правильно: попутаны приоритеты.

Sign In

Смещается горизонтальное меню вниз в Opere

Question

Newbie

Link to comment

Share on other sites

28 answers to this question

Recommended Posts

swetlana

Link to comment

Share on other sites

Newbie

Link to comment

Share on other sites

swetlana

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information