Помогите найти проблему

[star62]

Добрый день.

Есть страница http://olymp-travel.ru/countries/asia/china/shopping.html

На ней цепляется два css файла: main.css и asia.css

В первой есть стиль:

#maintext img {

float: right;

margin-right: 15px;

margin-bottom: 15px;

margin-left: 15px;

border:none;

}

а во втором:

div.products div img{

display: block;

margin: 0 auto;

float: none;

}

На странице есть код

<div class="products">

<div class="prod_left">

<img id="dress_img" ля-ля-ля />

</div>

</div>

который является содержимым тега <div id="maintext">

таким образом получаем пересечение стилец для img,

Я только начинаю с css, но мне кажется что настройки div.products div img должны перекрыть #maintext img. Однако у меня это не так!

Подскажите где я ошибаюсь и как мне исправить проблему?

[tius]

#id имеет больший приоритет чем .class

[star62]

Так и думал. Но с толку сбивает то, что я просто не представляю как эту ситуацию можно исправить? Ведь такая проблема я думаю возникает постоянно у многих. Как правильно сверстать страницу в моей ситуации? То есть когда-то настроили img через идентификатор, и теперь мне нужно его чуть иначе в другом месте настроить, как мне это сделать???

[tius]

у многих не возникает такой проблемы, потому что для стилей не используется #id, а только .class

#id оставьте для яваскриптов и прочего.

>Как правильно сверстать страницу в моей ситуации?

#maintext > .prod_left > img {float: none;}

Edited August 4, 2012 by tius

[star62]

Ясно, спасибо большое!