- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
В 2023 году Google заблокировал более 170 млн фальшивых отзывов на Картах
Это на 45% больше, чем в 2022 году
Оксана Мамчуева
Все что нужно знать о DDоS-атаках грамотному менеджеру
И как реагировать на "пожар", когда неизвестно, где хранятся "огнетушители
Антон Никонов
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Всем привет, не нашел ответа на свой вопрос, создаю новую тему.
Делаю резиновый дизайн, где 3 колонки, боковые имеют фиксированую ширину по 300px, а центральная растягивается по всей ширине моника то есть должна иметь width:100%. как вот, данная конструкция не работает :(.... помогите, в чем ошибка?, как лучше реализовать задачу?
<body>
<div id="container">
<div id="col-left">123</div>
<div id="col-center">123123</div>
<div id="col-right">123</div>
</div>
</body>
СSS
#container {
width:100%;
padding:5px;
background:#CCCCCC;
overflow:hidden;
}
#col-left {
width:300px;
background:#00CCFF;
float:left;
}
#col-center {
width:100%;
background:#0099FF;
float:left;
}
#col-right {
width:300px;
background: #0066FF;
float:left;
}
Я резиновые дизайны если честно надух не переношу, может быть зря конечно.. в данном случае мне не овтертется, пока не решу проблему, заранее спасибо.
Вот так это выглядит..
#col-right float:right;
не?
Вам нужно ширину для каждой колонки задавать в процентах. Если, к примеру, у Вас ширина контейнера по дизайну 900рх, то каждая колонка будет по 30%.
В html-коде центральный блок нужно поставить после боковых, т.е. вот так:
CSS-файл, соответственно, следующий:
#col-left {
width:300px;
background:#00CCFF;
float:left;
}
#col-center {
background:#0099FF;
margin:0 300px;
}
#col-right {
width:300px;
background: #0066FF;
float:right;
}
---------- Добавлено 26.12.2012 в 02:20 ----------
Вам нужно ширину для каждой колонки задавать в процентах. Если, к примеру, у Вас ширина контейнера по дизайну 900рх, то каждая колонка будет по 30%.
Ни к чему абсолютно. ТСу, я так понимаю, необходима фиксированная ширина боковых колонок, да и основной контейнер - на всю длину.
#col-right float:right;
не?
Не, пробовал, это нн канает.. нашел решение вот какое.. может кому пригодится.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Пример</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<meta name="generator" content="HAPedit 3.1">
<style type="text/css">
*{padding: 0; margin: 0;}
#page{
width: 100%;
min-width: 800px;
}
* html #page {
width:auto;
padding-left: 800px;
}
* html #container2 {
margin-left: -800px;
position: relative;
}
* html #page, * html #container1, * html #container2{
height: 0;
}
#header {
clear: both;
width: 100%;
height:100px;
background:#9999FF;
}
#main{
width: 100%;
background:#99CC00;
}
#content{margin: 0 200px;}
#left{
float: left;
width: 300px;
background:#00CCFF;
}
#right{
float: right;
width: 300px;
background:#0099FF;
}
#footer{
clear: both;
width: 100%;
height:100px;
background:#9999FF;
}
</style>
</head>
<body>
<div id="page">
<div id="container1">
<div id="container2">
<div id="header">Header</div>
<div id="main">
<div id="right">
right
</div>
<div id="left">
left
</div>
<div id="content">
content
</div>
</div>
<div id="footer">Footer</div>
</div>
</div>
</div>
</body>
</html>
То есть проблему решил.
Спасибо всем, решение было под носом.
То есть проблему решил.
и content будет после всякого хлама в сайдбарах... ))
и content будет после всякого хлама в сайдбарах... ))
Ну это уже другой вопрос. Думаю, ТС разберется :)
печальное решение вы нашли, коду тьма, а толку ....
печальное решение вы нашли, коду тьма, а толку ....
В чем именно "печальное"? Может, приведете Ваш вариант?
ТС, вы бы дали ссылку, где нашли, может там и объяснение есть. Непонятно зачем вот этот кусок:
* html #page {width:auto;
padding-left: 800px;
}
* html #container2 {
margin-left: -800px;
position: relative;
}
* html #page, * html #container1, * html #container2{
height: 0;
}
В остальном, как я понимаю, решение совпадает с предложенным товарищем sweb27.