Всем доброго времени суток. Наглядный пример -
http://komp-remont.hut4.ru/ . Теперь вопрос: есть три контейнера: левое меню, правое меню и основной контейнер в центре. Есть ли возможность сделать центрирование на центральном контейнере, при изменении размера окна браузера ? Ширина контейнера у меня указана в процентах %, все значения в EM. Просто столкнулся с проблемой разных разрешений и наплывании контейнеров друг на друга, поэтому стал использовать EM и проценты и полностью отказался от пикселей PX. А сейчас сворачивая браузер с одной стороны экрана и sublime text с другой, вижу, как некрасиво смотрится, когда центральный контейнер узкий, тогда как на нормальных сайтах, происходит центрирование основного контейнера. Даже не знаю, в моём случае блочной вёрстки, возможно ли это сделать, или это только скрипты помогут ? Заранее спасибо.
| HTML5 |
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
| <body>
<div id="main">
<div id="header"></div>
<div id="nav">
</div> <!-- nav -->
<div id="container">
<div id="links">
</div> <!-- links -->
<div id="content">
</div><!-- content -->
<div id="right">
</div>
</div> <!-- container -->
<div id="push"></div>
</div> <!-- main -->
<div class="clear"></div>
<div id="footer"> </div><!-- footer -->
</body> |
|
и css
| CSS |
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
34
35
36
37
38
39
40
41
| * { padding: 0; margin: 0;}
html { height: 100%; }
html, body { height: 100%;}
body {
font-size: 62.5%;
}
#main {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em;
}
#links {
width: 16%;
float: left;
}
#content {
width: 61%;
float: left;
}
#right {
width: 16%;
float: left;
text-align: right;
}
#footer {
height: 4em;
}
#push { height: 4em; }
.clear {
clear: both;
height: 10em;
} |
|
(
