Почему моя обертка не работает в HTML? - PullRequest
Новая
       4

Почему моя обертка не работает в HTML?

0 голосов
/ 25 ноября 2011

Это мой HTML-код сайта: 

<div id="wrapper">

<div id="header">
<img src="images/MyBannerFinished.jpg" alt="Header" width="803" class="headerimage" />
</div> <!--- close Header--->

<div id="navbar"> 
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Finished Assignments</a></li>
<li><a href="#">Contact</a></li>
</ul> 
</div><!---Close Nav --->

<h2>
<u>My report  1 </u>
</h2>

<p class="weeks"><u> Week 9</u></p>
    <p>gas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srz </p>
<p class="para">ddsaga34tr5sdfsafg34srzddsagas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srzgas34tr5sdfsafg34srz</p>

<!--- Footer --->
<div id="footer">footer</div>

</div> <!---Wrapper end --->

</body>

А это мой CSS: 

body
{
padding:5px;
}

p
{
margin:5px;
padding:5px;

}


p.weeks
{
font-size:25px;
padding-left:inherit;
text-align:center;
margin: 0 auto;
}

/*End general*/

div#wrapper 
{
width:50em;
margin: 0 auto;
}

div#header
{
}

#nav {
    width:50em;
margin: 0.5em 7em;
}

#nav ul
{
list-style: none;
padding: 0;
margin: 0;
}

#nav li
{
float: left;
margin: 0 0.15em;
}


/* Hide from IE5-Mac \*/
#nav-menu li a
{
float: none;
}
/* End hide */

Содержимое этого HTML-файла каким-то образом не связанооболочкой, даже если все содержимое находится внутри класса оболочки.Чего-то не хватает?

Также, если вы чувствуете, что не можете ответить на вопрос, не стесняйтесь опубликовать код, подробно описывающий, как установить обертку.Спасибо

Ответы [ 2 ]

3 голосов
/ 25 ноября 2011

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

Существует обертка слов свойства css3, которая может помочь в этих обстоятельствах, p {word-wrap: break-word; } хотя в этом случае я бы порекомендовал просто добавить пробелы в ваш тестовый контент (или скопировать часть loremipsum.)

2 голосов
/ 25 ноября 2011

Добавить переполнение: скрыто; к вашей обертке div. Это должно сортировать это.

...