| |
|
|
| | Есть <div> c размерами 200х200, в нем нужно разместить картиночку размерами 50х50, чтобы она распологалась по центру и по горизонтали, и по вертикали!
Так не работает!
<style>
.HeaderBanner {
text-align:center;
vertical-align:middle;
width:200px;
height:200px;
line-height:200px;
}
</style>
<div class="HeaderBanner" ><img src="images/banner.gif" width="50" height="50" alt="" align="middle"></div>
|
Пожалуйста, помогите решить эту проблему! | |
| |
|
|
| |
|
|
| |
для: Artemy
(19.04.2006 в 14:58)
| | |
<style>
.HeaderBanner {
padding-left: 75;
padding-top:75;
width:200px;
height:200px;
line-height:200px;
border: #000000 1px solid;
}
</style>
<div class="HeaderBanner" ><img src="images/banner.gif" width="50" height="50" alt="" align="middle"></div>
|
я приписала слою границы, чтобы было нагляднее. про другие браузеры не знаю, а в IE работает. | |
| |
|
|
| |
|
|
| |
для: elenaki
(19.04.2006 в 15:07)
| | | Так да, правильно!
Я не правельно написал! Див имеет не фиксированные размеры, а такие 100% на 100px! | |
| |
|
|
| |
|
|
| |
для: Artemy
(19.04.2006 в 14:58)
| | | Доброго времени суток.
Вашу проблему можно решить например таким способом:
<style>
.HeaderBanner {
width:200px;
height:200px;
}
.HeaderBanner IMG{
top: 50%;
left: 50%;
}
</style>
<div class="HeaderBanner" ><img src="images/banner.gif" width="50" height="50" alt="" align="middle"></div>
С уважением Яковлев Сергей. | |
| |
|
|
| |
|
|
| |
для: klay
(19.04.2006 в 16:49)
| | | Большое спасибо, Сергей!
Но я опять накосячил, забыл еще написать, что вместо этой картинки может быть все что угодно, но размеры у этого дива строго определенны 100% на 100 пк! | |
| |
|
|
| |
|
|
| |
для: Artemy
(19.04.2006 в 17:15)
| | | Картинка, а если быть более точным, непарный замещаемый элемент <IMG ... / >
по своей сути является блочным элементом. И только благодаря тому он позиционируется именно так.
А для того чтоб поместить НЕблочный элемент в центр - Вам нужно преобразовать или поместить
его в блок.
Преобразовать его можно примерно так:
Допустим у Вас есть строка, назначте ей ID или class. И присвойте этому стилю
свойство Display: block;
После этого, его можно точно так же позиционировать, как и в предидущем примере.
Ну а как поместить в блок надеюсь догадываетесь? :-)
С уважением Яковлев Сергей. | |
| |
|
|
| |
|
|
| |
для: klay
(19.04.2006 в 17:35)
| | | Спасибо! | |
| |
|
|
