Остановка переполнения содержимого в 2-х блоках css

#html #css

#HTML #css

Вопрос:

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

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

вот код, который у меня есть

таблица css

 #leftcol {
    float: left;
    height: auto;
    width: 300px;
    padding: 5px;
    border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    color: #fefcfc;
    background-color: #3f3f3f;
    text-align: justify;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; 
}
#rightcol {
    float: right;
    height: auto;
    width: 500px;
    padding-right: 35px;
    margin-right: 0px;
    border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    color: #fefcfc;
    background-color: #3f3f3f;
    text-align:justify;
}
  

HTML

 <div id="leftcol">dfgdfgdfgfdfdsfsdfdsfdsfdsfsdfsfdsfdsfsdgfgfsadsdsdasdsadsssadsda</div>
<div id="rightcol" style= width "500" > 
  <div>
    <p> sadhjashdjashdjashdakjs</p>
    <p> sadsadkasjdfksajfksjfksdfjkdfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffweweqweqwf</p>
  </div>
</div>
  

любая помощь была бы признательна

Спасибо

Комментарии:

1. Сразу могу сказать вам, что <div style= width "500"> это НЕ будет работать правильно. Должно гласить style="width: 500px" . В любом случае, я не вижу в этом смысла, поскольку вы устанавливаете ширину для этого элемента в другом месте.

Ответ №1:

Если я вас правильно понимаю, попробуйте это:

 #rightcol {
    word-wrap: break-word;
}
  

Это приведет к разрыву длинных строк текста.

Обратите внимание на комментарий Czechnology, у вас здесь есть какой-то недопустимый код, который <div id="rightcol" style= width "500" > должен быть <div id="rightcol" style="width:500px"> , или, желательно, его вообще нет (используйте CSS).

Комментарии:

1. спасибо за ваш ответ. я удалил код ширины стиля. это было только во время экспериментов. к сожалению, css ‘перенос слов’ не сработал, и мой текст по-прежнему вытекает из поля, а не на следующую строку. знаю, что должен быть простой ответ, но всегда возникают проблемы с основами, и найти более сложный материал проще, лол.