Что нужно прописать при верстке в css чтобы не растягивался сайт

@skryptman · Регистрация: 19.02.2010

Author24 — интернет-сервис помощи студентам

Добрался наконец до практики верстки, и тут сразу же возник вопрос. В общем сделал пока только верхнюю часть сайта, прописал в css значения, но вот при проверке в др браузер все растягивается и получается ерунда. Как запретить это и где в css файлике это нужно прописать?

@Samazar · 11.01.2012, 15:14

На сколько я понял ваш вопрос:

HTML5

1	<div class='wrap'>(Тут идет контент)</div>

Класс или id можно указать любые. Суть в том, что Вы все содержимое body помещаете в блок, которому указываете фиксированные размеры:

CSS

1	.wrap {width: 500px;}

Если используете id, вместо class, то используете # вместо .

Если это не то, что Вам нужно - продемонстрируйте код.

@skryptman · 11.01.2012, 15:22 **[ТС]**

Вот сам код

CSS

@charset "utf-8";
/* CSS Document */
*{
    padding:0; margin:0;
    }
    body{
        background: url(images/bg-body.jpg) center top;
    }
    .main{
        widh:860p; margin:0 auto;
    }
    .head{
    }
    .head h5{
        font: 15px "Georgia", Times New Roman, Times, serif; color:#353535; float:right; margin:20px 80px 0 0;
    }
    .head h5 span2{
        font-style:italic;
    }
        .head a{
        font: 36px "Georgia", Times New Roman, Times, serif; color:#000000; text-decoration:none; float:left; margin: 20px 0 0 80px;
    }
    .head a span{
        font-weight:bold;
     
    }

@Foxys · 11.01.2012, 15:37

ошибочка

.main{
widh:860px; margin:0 auto;
}

@Samazar · 11.01.2012, 15:57

skryptman, хотелось бы еще увидеть HTML код...

@skryptman · 11.01.2012, 16:13 **[ТС]**

После исправления появился другой косяк, а именно. Правая верхняя часть странички опустилась чуть ниже левой.

Вот html код

HTML5

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Документ без названия</title>
</head>
 
<body>
<div class="main">
      <div class="head">
      <a href="/"><span> Название блога</span></a>
      <h5><span2>Личный блог Неизвестного о заработке в интернете, социальных сетях,<br /> интернет маркетинге, о жизни и о многом другом. Заходите и<br /> становитесь подписчиками. Все будет круто!</span2></h5>
      
      </div>
</body>
</html>

@Samazar · 11.01.2012, 16:22

Вы забыли закрыть еще один div

Добавлено через 2 минуты

HTML5

<div class="main"> 
<div class="head"> 
<a href="/"><span> Название блога</span></a>
 <h5><span2>Личный блог Неизвестного о заработке в интернете, социальных сетях,<br /> интернет маркетинге, о жизни и о многом другом. Заходите и<br /> становитесь подписчиками. Все будет круто!</span2></h5> 
</div>
</div>
 </body>
 </html>

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

Добавлено через 2 минуты
И попробуйте увеличить ширину обертки. Зачастую бывает подобное, если ширина маловата...

@planod · 11.01.2012, 16:49

Сообщение от skryptman

.main{
width:860px; margin:0 auto;
}

Сообщение от skryptman

После исправления появился другой косяк, а именно. Правая верхняя часть странички опустилась чуть ниже левой.

а скрин можно?

@skryptman · 11.01.2012, 17:20 **[ТС]**

planod Вот

@Samazar · 11.01.2012, 17:23

Укажите ширину и для head тоже. Попробуйте уменшить margin-left. Судя по скриншоту - тексту не хватает места...

@skryptman 2 / 3 / 0 Регистрация: 19.02.2010 Сообщений: 58
		1
	Что нужно прописать при верстке в css чтобы не растягивался сайт 11.01.2012, 15:07. Показов 5654. Ответов 9 Метки нет (Все метки) Добрался наконец до практики верстки, и тут сразу же возник вопрос. В общем сделал пока только верхнюю часть сайта, прописал в css значения, но вот при проверке в др браузер все растягивается и получается ерунда. Как запретить это и где в css файлике это нужно прописать? 0

@Foxys 1 / 1 / 1 Регистрация: 03.01.2012 Сообщений: 16
	11.01.2012, 15:37	4
	ошибочка .main{ widh:860px; margin:0 auto; } 0

@Samazar 41 / 41 / 2 Регистрация: 02.11.2011 Сообщений: 193
	11.01.2012, 15:57	5
	skryptman, хотелось бы еще увидеть HTML код... 0

@planod 48 / 48 / 2 Регистрация: 25.05.2011 Сообщений: 277
	11.01.2012, 16:49	8
	Сообщение от skryptman .main{ width:860px; margin:0 auto; } Сообщение от skryptman После исправления появился другой косяк, а именно. Правая верхняя часть странички опустилась чуть ниже левой. а скрин можно? 0

@skryptman 2 / 3 / 0 Регистрация: 19.02.2010 Сообщений: 58
	11.01.2012, 17:20 [ТС]	9
	planod Вот 0

@Samazar 41 / 41 / 2 Регистрация: 02.11.2011 Сообщений: 193
	11.01.2012, 17:23	10
	Укажите ширину и для head тоже. Попробуйте уменшить margin-left. Судя по скриншоту - тексту не хватает места... 0

Опции темы