Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> позиционирование картинки 
V
    Опции темы
lvt
Дата 2.5.2012, 13:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 3
Регистрация: 31.10.2008

Репутация: нет
Всего: нет



Здравствуйте!

Есть картинка в div'е.

Код

<div>
<img src='' />
</div>
<style>
DIV {width: 90px; height: 90px;}
</style>


Необходимо чтобы картинка вылезала за границы дива сверху, если у нее высота больше, чем высота div'а. У меня она вылезает снизу. Я пробовала position:absolute выставлять, но тогда надо указывать top или bottom, а я не знаю будет ли высота у картинки выше или нет.

Подскажите, пожалуйста, как это сделать.

PM MAIL   Вверх
baldina
Дата 2.5.2012, 15:49 (ссылка) |    (голосов:1) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
****


Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

Репутация: 1
Всего: 101



Код

<div class="around">
  <div class="image">
    <img src="xxx.jpg" />
  </div>
</div>
<style>
div.around { width: 90px; height: 90px; position:relative; }
div.image { position:absolute; left:10px; bottom:50px; }
</style>


Добавлено через 5 минут и 35 секунд
если у родительского элемента position отличен от static, то позиция дочернего отсчитывается от позиции родительского. при этом absolute позволяет расположить его произвольно, с перекрытием других элементов.

Добавлено через 8 минут и 20 секунд
вобщем то можно и так:

Код

<div>
  <img src="img.jpg" width="50px"/>
</div>
<style>
  div { width: 90px; height: 90px; position:relative; }
  img { position:absolute; left:10px; bottom:50px; }
</style>


PM MAIL   Вверх
lvt
Дата 2.5.2012, 16:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 3
Регистрация: 31.10.2008

Репутация: нет
Всего: нет



Спасибо, все работает. Я забыла про position:relative;
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0578 ]   [ Использовано запросов: 20 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.