| |
|
|
| |
<div class="uc_bitva">
<img width="235" src="bitva_images/725_Jidkoe_jpg">
<span><b> Жидкое</b></span><span class="count_votes">4</span> <span>голосов</span></div>
|
Text-align не сработал и margin: 0 auto тоже | |
| |
|
|
| |
|
|
| |
для: OLi
(10.01.2012 в 19:15)
| | | А стили к чему применяли? text-align к <div>, а margin к <img>? | |
| |
|
|
| |
|
|
| |
для: cheops
(10.01.2012 в 19:52)
| | | К картинке | |
| |
|
|
| |
|
|
| |
для: OLi
(10.01.2012 в 19:59)
| | | text-align к картинке бесполезно, это нужно к div применять, который содержит картинку. | |
| |
|
|
| |
|
|
| |
для: cheops
(10.01.2012 в 20:22)
| | | text-align: center; применил к div - не помогло
А так же margin:0 auto не получилось применить к картинке | |
| |
|
|
| |
|
|
| |
для: OLi
(10.01.2012 в 20:34)
| | | Ребята, подскажите пожалуйста | |
| |
|
|
| |
|
|
| |
для: OLi
(10.01.2012 в 19:15)
| | | margin: 0 auto сработет только для блочных элементов (без float). потому чтобы так выровнять картинку задать ещё надо display: block для неё | |
| |
|
|
| |
|
|
| |
для: Lelik
(18.01.2012 в 18:28)
| | | не помогло | |
| |
|
|
| |
|
|
| |
для: OLi
(10.01.2012 в 19:15)
| | |
<html>
<head>
<style>
.uc_bitva {
width: 600px;
text-align: center;
border: 1px solid black;
}
</style>
</head>
<body>
<div class="uc_bitva">
<img width="235" src="img.jpg">
<span><b> Жидкое</b></span><span class="count_votes">4</span> <span>голосов</span></div>
</body>
</html>
|
вот пример, выравнивает по центру все содержимое div'a. у вас нет? | |
| |
|
|
| |
|
|
| |
для: Igorek
(18.01.2012 в 20:07)
| | | Оно то по центру - но по горизонтали, а нужно также и по вертикали | |
| |
|
|
| |
|
|
| |
для: OLi
(18.01.2012 в 20:47)
| | | для не-ИЕ браузеров сработают стили для дива:
display: table-cell;
vertical-align: middle;
|
для ИЕ - свои извращения. почитать можно здесь: http://www.sdelaysite.com/kniga/verstka-kniga/vertikalnoe-vyravnivanie | |
| |
|
|
| |
|
|
| |
для: OLi
(18.01.2012 в 20:47)
| | | для этого надо картинку уложить ещё в 1 блок:
<div class="uc_bitva">
<div class="img"><img width="235" src="bitva_images/725_Jidkoe_jpg"></div>
...
</div>
|
и стили
.uc_bitva {
position: relative;
overflow: hidden;
}
.uc_bitva .img {
position: absolute;
top: 50%;
right: 50%;
}
.uc_bitva .img img {
position: relative; /* если картинка должна быть над текстом, то лучше использовать position: relative */
top: -50%;
left: 50%;
}
|
Если картинка может и под текстом быть, то картинку лучше фоном уложить | |
| |
|
|
| |
|
|
| |
для: OLi
(18.01.2012 в 20:47)
| | | По вертикали чтобы выравнивать изображение можно использовать следующий способ:
<style>
div.wrap {
width: 200px;
height: 200px;
display:table-cell;
vertical-align:middle;
text-align:center;
}
/* следующей строкой убираем погрешность в несколько пикселей */
div.wrap img {
vertical-align: middle;
}
</style>
<div class="wrap">
<img src="image.png" alt="">
</div>
|
| |
| |
|
|
| |
|
|
| |
для: OLi
(10.01.2012 в 19:15)
| | |
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Пример выравнивания блока по центру</title>
<style type="text/css">
div {
width:320px;
height:240px;
background:#F93;
position:absolute;
top:50%;
left:50%;
margin:-120px 0 0 -160px;
text-align: center;
}
</style>
</head><body>
<div>Пример выравнивания блока по центру</div>
</body></html>
|
еще по теме....http://www.lukichev.org/puer-css-center | |
| |
|
|
