Создание макета с двумя колонками на 100% с начальной загрузкойHtml

Программисты Html
Ответить
Anonymous
 Создание макета с двумя колонками на 100% с начальной загрузкой

Сообщение Anonymous »

Итак, я пытаюсь создать макет с начальной загрузкой в ​​Твиттере и липким нижним колонтитулом Райана Фата < /p>

Код: Выделить всё




Side Panel

Hello World!




Я не могу расширить панель и содержание пользователя до 100%, пробовал их, но они не работают:
http://www.sitepoint.com/forums/showthr ... background />http://fiddle.jshell.net/teresko/ug8rk/show/ мне нужны округлые границы, так что ...
здесь css:

/* Header */
.header {
height: 40px;
margin-top: 0px;

border: 1px solid #999;
-webkit-border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
-webkit-box-shadow: #666 0px 1px 1px;
-moz-box-shadow: #666 0px 1px 1px;
box-shadow: #666 0px 1px 1px;
background: #f3f3f1;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f3f3f1), to(#2b2b2b));
background: -webkit-linear-gradient(#f3f3f1, #2b2b2b);
background: -moz-linear-gradient(#f3f3f1, #2b2b2b);
background: -ms-linear-gradient(#f3f3f1, #2b2b2b);
background: -o-linear-gradient(#f3f3f1, #2b2b2b);
background: linear-gradient(#f3f3f1, #2b2b2b);
-pie-background: linear-gradient(#f3f3f1, #2b2b2b);
behavior: url(/PIE.htc);
}
/* End of Header */

/* Footer */
.footer {
margin-top: 12px;
background-color: #000;

margin-bottom: 0px;
margin-right: 20px;
margin-left: 20px;
clear: both;
height: 40px;
border: 1px solid #999;
-webkit-border-radius: 5px 5px 0px 0px;
-moz-border-radius: 5px 5px 0px 0px;
border-radius: 5px 5px 0px 0px;
-webkit-box-shadow: #666 0px 1px 1px;
-moz-box-shadow: #666 0px 1px 1px;
box-shadow: #666 0px 1px 1px;
background: #f3f3f1;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f3f3f1), to(#2b2b2b));
background: -webkit-linear-gradient(#f3f3f1, #2b2b2b);
background: -moz-linear-gradient(#f3f3f1, #2b2b2b);
background: -ms-linear-gradient(#f3f3f1, #2b2b2b);
background: -o-linear-gradient(#f3f3f1, #2b2b2b);
background: linear-gradient(#f3f3f1, #2b2b2b);
-pie-background: linear-gradient(#f3f3f1, #2b2b2b);
behavior: url(/PIE.htc);
}
/* End of Footer */

/* Sticky footer by Ryan Fait... with a little customization*/
* {
margin: 0;
}

html,
body {
height: 100%;
}

.wrapper {
padding-left: 20px;
padding-right: 20px;
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -4em;
}

.push {
height: 40px;
clear: both;
}
/* End of Sticky footer*/

/* User Panel ( that sidepanel on the left side with navigation etc) */
.user-panel {
border: 1px solid #999;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: #666 0px 1px 1px;
-moz-box-shadow: #666 0px 1px 1px;
box-shadow: #666 0px 1px 1px;
background: #f3f3f1;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#f3f3f1), to(#2b2b2b));
background: -webkit-linear-gradient(#f3f3f1, #2b2b2b);
background: -moz-linear-gradient(#f3f3f1, #2b2b2b);
background: -ms-linear-gradient(#f3f3f1, #2b2b2b);
background: -o-linear-gradient(#f3f3f1, #2b2b2b);
background: linear-gradient(#f3f3f1, #2b2b2b);
-pie-background: linear-gradient(#f3f3f1, #2b2b2b);
behavior: url(/PIE.htc);
width: 175px;
float: left;
height: inherit;
background: gray;
}
/* End of User Panel */

Любая справка оценена ... спасибо ...
Редактировать:
Спасибо Андреа Лигиос за скрипку! Хром ...

Подробнее здесь: https://stackoverflow.com/questions/131 ... -bootstrap
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»