Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.89/9: Рейтинг темы: голосов - 9, средняя оценка - 4.89
0 / 0 / 0
Регистрация: 05.11.2013
Сообщений: 5
1

Растянуть боковые div на 100% c отступами

05.11.2013, 20:04. Показов 1734. Ответов 2
Метки нет (Все метки)

Нужно сверстать страницу имеются 4 дива: 1 сверху 1 снизу и 2 по бокам.
Нужно что бы 2 боковых дива растягивались на ширину страницы.
Растянуть боковые div на 100% c отступами

Суть в том что сверху идет картинка а вниз идет уже цвет.
сверху див частично прозрачный поетому просто поместь под z-index -хххх не вариант

помогите именно с css для боковых div

 Комментарий модератора 
Загружайте изображения и файлы на форум и прикрепляйте к сообщению.
https://www.cyberforum.ru/abou... post594251
0

Помощь в написании контрольных, курсовых и дипломных работ здесь.

Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
05.11.2013, 20:04
Ответы с готовыми решениями:

Растянуть div в высоту на 100% или на занимаемое пространство вложенного div
Ситуация такая, есть див-1, в нем несколько дивов. Див-1 осуществляет роль фоновой картинки(т.е....

Растянуть div на 100% по высоте
Похожие темы на форуме вроде есть, но ответа так и не нашел. Такая ситуация div внутри div'a,...

div с отступами!
Привет! Ширина родителя 1170px. Ширина каждого из 3-х блоков 370px. расстояние между блоками...

Вложенный div с высотой родителя и отступами
Только начал изучать html и CSS. Никак не могу понять как сделать простую вещь: 2 div-а. Один...

2
1 / 1 / 1
Регистрация: 30.10.2013
Сообщений: 9
05.11.2013, 23:33 2
Лучший ответ Сообщение было отмечено masterm как решение

Решение

задай div3 float:left; а div4 float:right; через селекторы (id например) также задай им фиксированную ширину, а контент по середине будет растягиваться автоматически
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
32
33
34
35
36
37
38
39
40
41
42
43
<body>
    <div id="wrapper">
        <div id="header">
        </div>
        
        <div id="left">
            <h1>левая колонка</h1>
        </div>
        
        <div id="right">
            <h1>правая колонка</h1>
        </div>
    </div>
</body>
 
в файле css пишешь
body{
    background-color:#D2D2D2;
    font:11px Verdana;
    color:#696969;
    margin:0;
    padding:0;
}
 
 
#header{
    height:77px;
    background-color:#777471;
}
 
#left{
    float:left;
    width:177px;
    height:100%;
    background-color:#00FFA9;
}
 
#right{
    float:right;
    width:177px;
    height:100%;
    background-color:#3AE2CE;
}
Добавлено через 9 минут
а если хочешь что бы по середине между div3 и div4 ничего не было, задай ширину по 50% каждому
0
0 / 0 / 0
Регистрация: 05.11.2013
Сообщений: 5
06.11.2013, 18:21  [ТС] 3
не получается сделать. http://obi.eu5.org/index.php/r... stirovanie вот ссылка где видно что боковые дивы отрыватся от низа и не растягиваются на все 100%
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
06.11.2013, 18:21

Помощь в написании контрольных, курсовых и дипломных работ здесь.

Растянуть div col-xs-4 во всю высоту div row (bootstrap)
Здравствуйте Как сделать &lt;div class=&quot;col-xs-4&quot;&gt; во всю высоту &lt;div class=&quot;row&quot;&gt;? &lt;div...

Как растянуть div на всю страницу внутри фиксированного div
Здравствуйте, скажите пожалуйста как можно растянуть div на всю страницу внутри фиксированного div...

Как растянуть основной div до футера и разместить текст ровно центру этого div?
Всем привет, решил попробовать создать простейший резиновый сайт и чтобы футер был привязан внизу,...

Растянуть элемент Div на всю высоту родительского div
Как сделать что бы элемент Div растягивался на всю высоту следующего элемента? Я только...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.