Jump to content
  • 0

Помогите сверстать блоками...

NightRunner

Asked by NightRunner,

 Share

Question

NightRunner Explorer

NightRunner

Posted
Posted

Всем привет!

Нужен совет или лучше урок :)

Задача: сверсать сайт блоками, так что бы все блоки были как на картинке ниже

98de44fcda89cc6ecd.jpg

Необходимо, что бы все блоки распологались по середине и имели одинаковую шинрину

Вверху будет логотип сайта, ниже навигация с картой изображений, дальше блоки с текстом и в самом низу копирайты и т.д.

Я только начинаю работать в этой области, поэтому сильно не ругайте за глупые вопросы :)

Раньше делал сайты на таблицах, но в этом случае нужна верстка именно блоками...

Заранее благодарен.

Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 0
NightRunner Explorer

NightRunner

Posted
  • Author
Posted

Девятилап

Ну я имел ввиду что, нужен совет или пример конкретный...

Пробовал делать в FrontPage03, но там слоям задаются абсолютные координаты, а мне надо что бы выравнивание было всегда по центру и при этом ширина блоков была абсолютной и не менялась в зависимости от ширины окна браузера.

Link to comment
Share on other sites
  • 0
Scrum Explorer

Scrum

Posted
Posted

Примерно так.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
 <title></title>
 <style type="text/css">
 /*<![CDATA[*/
 #carier {
 margin: 0 auto;
 width: 760px;
 }
 #logo, #menu, #content_right, #content, #footer {
 background: silver;
 }

 #logo {
 height: 250px;
 }
 #menu {
 height: 15px;
 margin: 10px 0;
 }
 #content_right {
 float: right;
 width: 300px;
 height: 400px;
 }
 #content {
 margin-right: 310px;
 height: 400px;
 }
 #footer {
 margin-top: 10px;
 height: 100px;
 }



 /*]]>*/
 </style>
</head>

<body>
 <div id="carrier">
 <div id="logo"></div>
 <div id="menu"></div>
 <div id="content_right"></div>
 <div id="content"></div>
 <div id="footer"></div>
 </div>
</body>

</html>

Link to comment
Share on other sites
Guest
This topic is now closed to further replies.
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept