Размещение картинки в центре слоя

[Ururu]

Добрый день.

Слой с логотипом растягивается по всей ширине экрана. Картинка по ширине заведомо больше нужного размера.

Как разместить центр картинки (по горизонтали) строго по центру слоя, желательно в фоне.

Спасибо.

П.С. Резать пополам картинку не хотелось бы.

Edited April 7, 2012 by Ururu

[hypnocolor]

Ururu, добавить margin: 0 auto; для картинки, не? Или я вас не так понял? С примером кода/ссылкой было бы нагляднее.

[Switch74]

если знаете размер картинки, например 1000px то

img{
 position:absolute;
 left:50%;
 margin-left:-500px;
}

вроде как-то так

для родительского блока не забудь указать position

аа... если нужно в фоне, то

div{
 background:url('img');
 background-position:center top;
}

Edited April 7, 2012 by Switch74

[alexandr_v-vich]

hypnocolor, наврятли..

Ururu, раз картинка фиксированная, то способ такой -

для картинки - left: 50%; margin-left: (минус половина ширины картинки);

чтоб понятней было - http://jsfiddle.net/EmcRy/17/

UPD: Вот всегда я так опаздываю)))

[Switch74]

а я тут накропалить успел выравнивание подобных картинок по горизонтали не зная их размера

<style>
.outer{width:500px;height:100px;overflow:hidden;border:1px solid #000;}
.outer>.inner{display:inline-block;position:relative;left:50%;}
.outer>.inner>img{position:relative;left:-50%;width:700px;height:100px;background:#ddd;}
</style>
<div class="outer">
	<span class="inner">
		<img>
	</span>
</div>

Edited April 7, 2012 by Switch74