powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
20 сообщений из 20, страница 1 из 1
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237359
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
сабж
C ув. Tors
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237360
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tors,

высота блока фиксирована?
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237367
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
как сделать сабж фесли фиксирована
и как если не фиксирована?
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237372
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
torsкак сделать сабж фесли фиксирована
и как если не фиксирована?Таблицей. Оба варианта.
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237380
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
для фиксированного можно просто http://jsfiddle.net/HSTXT/
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237939
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
авторкак грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
пытаюсь отцентрировать по горизонтали и вертикали так :
Код: css
1.
div.wrapper {display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle;}



Предполагается, width и height 100% от размера body
но у нас свой движек и он генерит промежуточные div'ы

Код: html
1.
2.
3.
4.
5.
6.
7.
<div id="screen" view="view.start_page">
 <div class="backbone-view" data-role="view">
   <div class="wrapper">
    <img src="../core/images/logo.jpg">
  </div>
 </div>
</div>



Поэтому данный подход не работает,
хотя если указать явно размеры - работает

как быть?
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38238143
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
torsкак быть?
Ответ был дан выше...
AntonariyТаблицей.
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38238147
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Я бы тоже сделал таблицей и не парился.
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38238168
ЫLL HEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tors,

тупо подставил ваш html (без вашего css) в ссылку:
Яростный Мечдля фиксированного можно просто http://jsfiddle.net/HSTXT/ див приклеен к середине по высоте
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241420
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
авторЯ бы тоже сделал таблицей и не парился.

http://jsfiddle.net/SEe3H/

взято один в один отсюда :) :
http://css-tricks.ru/Articles/Details/VerticalCenteringCSS

ни работает
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241447
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tors,

Сделайте табличку с одной ячейкой, пропишите в свойствах (стили даже не трогайте) центрирование, и будет вам щасте.
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241456
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
А остальные 4?
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241487
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
авторА остальные 4?

негодяццо
я не знаю разрешение девайса
центрируемый блок не имеет фиксированной высоты
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241530
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
tors , ты хоть тут только в одной теме пиши...
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241571
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        .tablewrapper {display: table; border-style: solid; height: 500px}
        .cellwrapper {display: table-cell; vertical-align: middle; height: 100%;}
        body {height: 100%;}
    </style>
</head>
<body>
    <div class="tablewrapper">
        <div class="cellwrapper">
          <div>
            <ul>
                <li id="cards">
                    <span>CARDS</span>
                </li>
                <li id="filters">
                    <span>FILTERS</span>
                </li>
                <li id="stats">
                    <span>STATS</span>
                </li>
                <li id="help">
                    <span>HELP</span>
                </li>
            </ul>
        </div>
      </div>
    </div>
</body>
</html>



Код: css
1.
.tablewrapper {display: table; border-style: solid; height: 500px}


так центрируется
height : 500px
а так нет
height: 100%
почему браузер не понимает "%" ?
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241578
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<body>
<table class="tablewrapper" valign="middle">
    <tr valign="middle">
    <td class="cellwrapper" valign="middle">
        <div>
            <ul>
                <li id="cards">
                    <span>CARDS</span>
                </li>
                <li id="filters">
                    <span>FILTERS</span>
                </li>
                <li id="stats">
                    <span>STATS</span>
                </li>
                <li id="help">
                    <span>HELP</span>
                </li>
            </ul>
        </div>
    </td>
    </tr>
</table>
</body>
</body>
</html>



ни работает

блин до чего же геморная штука верстка и css
неужели в w3 не додумались как то штатно сделать вертикальное выравнивание
а то надо извращаться
все через ж@#$у
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241620
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
torsвсе через ж@#$у
У тебя - да.
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241621
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
torsнеужели в w3 не додумались как то штатно сделать вертикальное выравниваниеЭто ты не додумался, а не w3c.
Код: css
1.
html, body {height: 100%;}
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241627
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
torsпочему браузер не понимает "%" ?Чтобы "браузер понимал" проценты у какого-то элемента, нужно чтобы вся иерархия контейнеров этого элемента точно знала свою высоту хоть в каких-то единицах.
...
Рейтинг: 0 / 0
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241642
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: css
1.
html, body {height: 100%;}



я вешал 100% только на body

спасибо большое за помощь, хе-хе - работает
...
Рейтинг: 0 / 0
20 сообщений из 20, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]