2013-09-24 3 views
2

Я создаю веб-сайт с использованием HTML5 и CSS3. Я создавал изображение с чистым CSS и имел некоторые проблемы, когда я помещал два изображения CSS вместе, и один из них имел несколько строк текста.Text over-laping CSS Image

Теперь я буду прямо сейчас - я создал квадратное изображение и разделил их. Я поместил текст в одном из них с помощью:

<p></p> 

Вот источник в CSS изображения с текстом:

#right { 
background-color: #FFFFFF; 
height: 900px; 
position:absolute; 
border-width:1px; 
display: block; 
border-style:solid; 
margin-left: auto; 
font-family: 'Ubuntu', sans-serif; 
font-size: 85%; 
margin-right; auto; 
color: #000000; 
border-right-color:white; 
border-color:grey;border-style:solid; 
border-top-left-radius: 5px; 
top:300px; 
width: 300px; 
left:102px; 

Вот второй источник CSS Image:

#middle { 
background-color: #FFFFFF; 
height: 900px; 
position:absolute; 
color: #000000; 
display: block; 
margin-left:auto; 
border-right-color:white; 
border-width:1px; 
text-align:center; 
margin-right; auto; 
border-left-color:white; 
top:300px; 
border-top-color:grey; 
border-style:solid; 
width: 560px; 
left: 390px 
} 

Хорошо, теперь движется на источник HTML5:

<a id="bottom"></a></div> 
<!--Begin page --> 

<div id="right"> 
      <p>FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFff</p> 
</div> 

Ладно, теперь я извиняюсь. Если этот вопрос кажется вам глупым, просто чтобы сделать резервную копию всего, что я объяснил, я представил изображение проблемы, с которой я хочу, чтобы вы лучше поняли.

enter image description here

+0

стилей CSS на DIV не является изображением. Пожалуйста, перепишите свой вопрос, чтобы понять, какова ваша проблема на самом деле, так как половина вашего CSS не используется в HTML, который вы предоставили, а скриншот - это всего лишь текст над несколькими граничными div. – mavrosxristoforos

+0

Эй, пожалуйста, поймите, я новичок в этом типе языка кодирования. Я отредактирую это, чтобы сделать его более понятным. Это будет закрыто, так как на это был дан ответ и исправлена ​​проблема. – Shaun

+0

Ваши вопросы должны показать исследовательские усилия. Я понимаю, что вы новичок, но сначала попробуйте найти ответы, так как все, что вы действительно искали, было свойством CSS, чтобы обернуть текст внутри вашего div. – mavrosxristoforos

ответ

1

Что вам нужно word-wrap: break-word;, это заставит НЕРАСПРОСТРАНЕНИЕ разнесенного строки, чтобы обернуть внутри элемента с фиксированной шириной.

Demo

+1

Ты потрясающий чувак! Спасибо за вашу помощь и ответ; Он отлично работал. Мне потребовалось некоторое время, чтобы задать этот вопрос как можно проще - в любом случае, спасибо снова. – Shaun

+0

@ShaunS вы приветствуете :), и я думаю, вы новый пользователь, поэтому всегда принимайте правильные ответы, когда задаете вопрос, нажимая на галочку, кроме моего ответа :), хотя вы можете это сделать через 15 минут. –

+0

Да, я буду , и да, я действительно. Надеюсь, что я не создаю проблем для людей, потому что я новичок. – Shaun