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

высота блока фиксирована?
...
Рейтинг: 0 / 0
23.04.2013, 21:34
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237367
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
tors
Участник
как сделать сабж фесли фиксирована
и как если не фиксирована?
...
Рейтинг: 0 / 0
23.04.2013, 21:41
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237372
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
torsкак сделать сабж фесли фиксирована
и как если не фиксирована?Таблицей. Оба варианта.
...
Рейтинг: 0 / 0
23.04.2013, 21:44
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237380
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Яростный Меч
Участник
для фиксированного можно просто http://jsfiddle.net/HSTXT/
...
Рейтинг: 0 / 0
23.04.2013, 21:52
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38237939
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
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
24.04.2013, 12:16
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38238143
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
torsкак быть?
Ответ был дан выше...
AntonariyТаблицей.
...
Рейтинг: 0 / 0
24.04.2013, 13:40
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38238147
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Я бы тоже сделал таблицей и не парился.
...
Рейтинг: 0 / 0
24.04.2013, 13:41
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38238168
ЫLL HEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ЫLL HEAD
Участник
tors,

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

http://jsfiddle.net/SEe3H/

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

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

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

негодяццо
я не знаю разрешение девайса
центрируемый блок не имеет фиксированной высоты
...
Рейтинг: 0 / 0
26.04.2013, 13:51
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241530
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
tors , ты хоть тут только в одной теме пиши...
...
Рейтинг: 0 / 0
26.04.2013, 14:03
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241571
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
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
26.04.2013, 14:23
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241578
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
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
26.04.2013, 14:27
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241620
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
torsвсе через ж@#$у
У тебя - да.
...
Рейтинг: 0 / 0
26.04.2013, 14:49
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241621
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
torsнеужели в w3 не додумались как то штатно сделать вертикальное выравниваниеЭто ты не додумался, а не w3c.
Код: css
1.
html, body {height: 100%;}
...
Рейтинг: 0 / 0
26.04.2013, 14:49
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241627
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
torsпочему браузер не понимает "%" ?Чтобы "браузер понимал" проценты у какого-то элемента, нужно чтобы вся иерархия контейнеров этого элемента точно знала свою высоту хоть в каких-то единицах.
...
Рейтинг: 0 / 0
26.04.2013, 14:53
| Ответить | Цитировать | Написать  
как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
    #38241642
tors
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
tors
Участник
Код: css
1.
html, body {height: 100%;}



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

спасибо большое за помощь, хе-хе - работает
...
Рейтинг: 0 / 0
26.04.2013, 15:02
| Ответить | Цитировать | Написать  
20 сообщений из 20, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / как грамотно по вертикали отцентрировать блок (для любых девайсов и разрешений)
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&fpage=133&tid=1448400]:
 0ms
get settings:
 7ms
get forum list:
 18ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 91ms
get topic data:
 8ms
get forum data:
 2ms
get page messages:
 35ms
get tp. blocked users:
 1ms
others: 231ms
total:  399ms
созд. / загр.: 399ms
x
x
Закрыть


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