28 июля 2009 в 21:19
вопрос не по друпалу, но всё же , подскажите пожалуйста
как делается обтекание картинки текстом слева (при том, что картинка должна быть расположена внизу страницы). В DOM картинка идёт после текста.
я думал - что будет работать обычное float:right; - как например для картинки вверху, которая обтекается справа, работает обычное float:left.
Пытаюсь задавать отрицательный margin-top, но тогда картинка наезжает на текст (если задать для картинки position:relative;). (или же текст на картинку, если не задавать position:relative; для картинки)
Вот, подскажите пожалуйста - заранее спасибо )
Комментарии
То есть сначала текст, потом картинка?
clear: both;вместоfloat:right;+ отступы.ну вот, надо вот так вот:
текст текст текст текст
текста текc ///////////////
текст текст /картинка/
текст текст //////////////
понимаете - фишка в том, что картинка как бы врезается в нижний правый угол, но надо чтобы под картинкой никакого текста не было - в этом весь смысл
задал clear:both - и плюс отступы - но когда задаёшь отрицательный отступ для картинки сверху, то тогда картинка просто наезжает на текст, и скрывает его под собой, а это тоже не дело
Хм, а для чего отрицательный отступ?
вёрстка фиксированная или "резиновая"?
картинки постоянного размера или нет?
фикса
картинки - да - постоянного, я сделал скалирование 150 на 150, использую imagecache
отрицательный отступ вверху - чтобы картинка поднялась вверх, ибо без этого картинка просто под текстом располагается
Интересная задача. А если так?
img {width: 150px; height: 150px; position: relative; float: right; margin: 5px; z-index: -1;}P.S. Удобно для тестов. Тут можно поискать по этой теме.
так когда задаешь отрицательное значение z-index, то в мозиле то такой элемент вообще отображаться не будет - он просто напросто исчезнет.
и исчезает правда не только в мозилле, как сказано в туториале, а у меня вот ещё и в опере исчез
П.С. спасибо за линки )
Вообще, нужна обёртка
.some_div img {float: right; clear: right; width: 150px; height: 150px; }?P.S. Про z-index: это параметр наложения. Пр указание размеров блока должно быть всё норм. По линку на w3schools.com тестил, всё работало
.some_div img - в данном случае непонятен смысл дива, ибо вы всё равно прописали стили для img
может вы имели ввиду, что надо прописать так
.some_div {float: right; clear: right; width: 150px; height: 150px; }?ну вообще - дивов там сколько угодно, для дивов я тоже пробовал. Верно, если размер блока задаёшь явно - ширину и высоту, то объект не исчезает, но лишь только в том случае, если не задаёшь position:relative; для картинки. А если задашь position:relative; , то всё пропадает.
П.С. Спасибо большое за советы )
.some_div это "обёртка" картинки
да я понимаю что обёртка - но просто вы там стиль прописали именно для самой картинки, а не для обёртки, я это имел ввиду