Текст, выходящий за пределы контейнера div

Я делаю школьный проект, где я изучаю, как использовать шаблоны Dreamweaver. У меня есть страница, и шаблоны работают, но текст, который длиннее на других страницах, не содержится внутри div контента, как он должен. Я не уверен, почему? Я не знаю, как сделать скрипку, но это hte-код.Текст, выходящий за пределы контейнера div

HTML:

<div class="container"> 
     <div class="content" id="home_img"> 
<!-- TemplateBeginEditable name="photo" --> 
    <img src="../photos-winery/napa2_edit.jpg" width="457" height="300" alt="Winery" /> 
<!-- TemplateEndEditable --> 

<!-- TemplateBeginEditable name="text" --> 
     <div class="text"> 
      <h1>A Napa Valley winery dedicated to quality wines for three generations.</h1> 
      <p> Offering a selection of classic varietals to last: Merlot, Syrah, Cabernet Sauvignon, Chardonnay, Sauvignon Blanc, Chenin Blanc, and more. </p> 
      <h2>Because life is too short for compromise.</h2> 
      <!--end .text --></div> 
     <!-- TemplateEndEditable --><!-- end .content --></div>

CSS:

#container { 
    background-color: transparent; 
    height: 100%; 
    padding-top: 10px; 
    width: 100%; 
} 


.content { 
    margin-top: 5em; 
    background-color: rgba(0,0,0,.05); 
    font-family: "Times New Roman", Times, serif; 
    font-size: 16px; 
    line-height: 1.28em; 
    letter-spacing: 1.5px; 
    vertical-align: middle; 
    text-align: left; 
    padding: 60px 0 60px; 
    position: relative; 
    background-image: url(../photos-winery/vine_edit.png); 
    background-repeat: no-repeat; 
    background-position: right top; 
    width: 955px; 
    border: medium solid #CCC; 
} 


.content #home_img { 
    margin: 10px; 
    float: right; 
    border: 1px outset #000000; 
    text-align: right; 
} 
.text { 
    width: 45%; 
    margin-top: 2em; 
    margin-left: 5px; 
    margin-right: 2em; 
    float: right; 
}

Любая помощь приветствуется

snippet of page

источник

2015-02-26 Jason Cameron

Вы можете добавить скриншот? как он выглядит на твоем конце? что должно быть по-другому? Вот скрипка для вашего кода: http://jsfiddle.net/x0qf67md/ – TheUknown

Ваш текст плавающий, и контейнер не плавает или делает какое-либо четкое исправление, поэтому текст плавает снаружи. Также в вашем html нет '# container'. – Huangism

Эта скрипка - это то, на что она должна выглядеть. Я изменил div class = 'container' на идентификатор. В том же результате я взял фрагмент из него, но не уверен, что hwo поместил его сюда –

HTML: <div ID="blabla"> -> CSS: #blabla{}

HTML: <div class="blabla"> -> CSS: .blabla{}

Посмотрите на разницу в вашем коде.

источник

2015-02-26 20:38:05

Текст, выходящий за пределы контейнера div

ответ

Смежные вопросы