---
title: "Попытки сумасшедшего"
description: "Пытаюсь сделать резиновый макет сайта, при чем html код я знаю, но не очень хорошо… Если меня видит ..."
author: "fuck"
published: "2009-11-23T04:10:41+00:00"
modified: "2009-11-23T04:10:41+00:00"
locale: "ru"
canonical_url: "https://yvision.kz/post/popytki-sumasshedshego-22441"
markdown_url: "https://yvision.kz/post/popytki-sumasshedshego-22441/markdown"
site_name: "Yvision.kz"
---

# Попытки сумасшедшего

> Пытаюсь сделать резиновый макет сайта, при чем html код я знаю, но не очень хорошо… Если меня видит ...

Пытаюсь сделать резиновый макет сайта, при чем html код я знаю, но не очень хорошо… Если меня видит кто–нибудь из веб–мастеров, огромная просьба расшифровать данную [статью](http://www.linkexchanger.su/2008/16.html)… (откроется в новом окне)

Создание "резинового" макета страницы из трех колонок. Как и в случае макета с двумя колонками сначала создадим HTML-разметку, которую будем в дальнейшем форматировать. По-моему это даже проще, чем одноколоночный макет... Итак, зададим HTML-разметку: и отформатируем ее с помощью следующей таблицы стилей: В этом решении все три колонки включены в плавающую модель, выравниваются по левому краю и суммарная их ширина не превышает 100%.

```

... шапка страницы ...

... колонка меню ...

... основное содержимое страницы ...

... колонка меню ...

... подвал ...

```

```
#content { float:left; width:50%; background-color:#CCC;}#sidebar { float:left; width:30%; background-color:#FFC;}#otherbar { float:left; width:20%; background-color:#FFC;}#header { background-color:#FCF; text-align:center;}#footer { clear:both; text-align:center; background-color:#CFF;}
```

Однако следует очень внимательно относиться к полям, рамкам и отступам этих элементов, поскольку, если суммарная ширина колонок превысит 100%, то одна или две колонки будут расположены друг под другом.

Вот так легко и просто. Этот метод работает во всех популярных браузерах.

---

Source: [https://yvision.kz/post/popytki-sumasshedshego-22441](https://yvision.kz/post/popytki-sumasshedshego-22441)