Форум Сайтостроение Веб-строительство

Как закрепить логотип на одном месте

A
На сайте с 04.11.2013
Offline
16
Arcane
1387

Есть фон, в браузере располагается по центру документа, при наложении на фон логотипа он встает нормально, но при масштабировании окна браузера(увеличение/уменьшение) логотип начинает "ездить" по фону влево/вправо, а мне надо его зафиксировать чисто по центру фона, чтобы не съезжал даже при изменении масштаба

Код HTML: 

<!--Внешний основной контейнер-->

	<div id="main">

      <!--Внутренний основной контейнер-->

	  <div id="main-inner">

         	

		<!--Контейнер с шапкой-->

        <div id="header">

        	<!--Контейнер с логотипом-->

        	<div id="logo">

			  <div class="logo">

				<a href="Index.html"><img src="img/logo.png" /></a>

			  </div>

        	</div><!--Закрытие контейнера с логотипом-->       

                              	

        </div><!--Закрытие контейнера с шапкой-->

 </div><!--Закрытие внешний основной контейнер-->

CSS: 

body {

	background-color:#FFF;

	margin:0px;

	padding:0px;

	background-image:url(../img/fon.jpg);

	background-position:center top;

	background-repeat:no-repeat;

	overflow-x: hidden;

}

#main {

	width:1900px;

	height:1933px;

	margin:0 auto;

	position: relative;

	z-index: 10;

}

#header {

	float:left;

	width:1900px;

	height:298px;

	margin:auto;

	position: relative;

}

#logo {

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

}



.logo {

	position: relative;

	width:1001px;

	height:258px;

	margin: 0 auto;

	left:0px;

	top:40px;

}

position:absolute не помогает

Olldman
На сайте с 21.04.2010
Offline
79
Olldman
#1

В .logo - определитесь уже что вам нужно - margin:0 auto; , или таки left:0;, который переопределяет margin.

dj dimonza
На сайте с 12.11.2012
Offline
38
dj dimonza
#2

Наверное так?

HTML: 

<!--Внешний основной контейнер-->

	<div id="main">

      <!--Внутренний основной контейнер-->

	  <div id="main-inner">

         	

		<!--Контейнер с шапкой-->

        <div id="header">

        	<!--Контейнер с логотипом-->

        	<div id="logo">

			  <div class="logo">

				<a href="Index.html"><img src="img/logo.png" /></a>

			  </div>

        	</div><!--Закрытие контейнера с логотипом-->       

                              	

        </div><!--Закрытие контейнера с шапкой-->

 </div><!--Закрытие внешний основной контейнер-->

CSS: 

body {

	background-color:#FFF;

	margin:0px;

	padding:0px;

	background-image:url(../img/fon.jpg);

	background-position:center top;

	background-repeat:no-repeat;

	overflow-x: hidden;

}

#main {

	width:1900px;

	height:1933px;

	margin:0 auto;

	position: relative;

	z-index: 10;

}

#header {

	float:left;

	width:1900px;

	height:298px;

	margin:auto;

	position: relative;

}

#logo {

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

}



.logo {

	position: relative;

	width:1001px;

	height:258px;

	margin: 0 auto;

}



.logo a{

display: block;

margin: 40px auto 0 auto;

width: 258px;

}
Нужен дизайн или верстка? тогда вам сюда (/ru/forum/816216)
R
На сайте с 18.12.2009
Offline
92
rerighter
#3

Что значит наверно? А посмотреть Вы сами на сайте не в силах?

dj dimonza
На сайте с 12.11.2012
Offline
38
dj dimonza
#4
rerighter:
Что значит наверно? А посмотреть Вы сами на сайте не в силах?

Вы меня с ТС не перепутали? я то посмотрел, и сделал так как я понял, все работает. Но вдруг ТСу нужно что то другое, или мой способ ему не подходит

R
На сайте с 18.12.2009
Offline
92
rerighter
#5

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

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий