Как перенести текст на новую строчку?

Question

[rikimaru14]

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

.wrapper {
  display: flex;
  width: 100vw;
  height: 80vh;
  align-items: flex-end;
  justify-content: center;
}
.notification {
  display: flex;
  align-items: flex-end;
  justify-content: space-around;
  width: 1200px;
  background: rgba(34, 34, 34, 0.94);
	color: rgba(1, 1, 0,1);
  border-radius: 0px;
  height: 150px;
  margin-bottom: 100px;
  transition: all .3s;
  font-size: 24px;
  
  

}

а вот код текста

.notification .text {
  
  color: white;
  position: absolute;
  font-family: 'Cartonsix NC';
  font-weight: 300;
  font-height: 100;
  font-size: 25px;
  height: 350px;
  display: block;
  margin-bottom: 10px;
  top: 350px;
  
  left: 95px;
}

Answer 1

[xonar]

https://codepen.io/ruslan-lysenko/pen/XWrZzRy так вы хотите?

Comments

[rikimaru14]

да

[xonar]

rikimaru14, Ошибка была в том, что вы не задали position: relative блоку нотификации, но задали блоку text абсолют и задали ему отступы слева и сверху, но они брались не от нотификаций, так как вы им не задали абсолют.

Отметьте ответ как решение, если помог.

[rikimaru14]

xonar, спасибо, а знаете как сделать что бы текст был по середине , ну что бы строчки были ровными сейчас отправлю скриншот как у меня

Answer 2

[irishmann]

Word-wrap: break-all или break-word

Comments

[rikimaru14]

все равно заходит

[irishmann]

rikimaru14, куда ты свойство вставил?

[rikimaru14]

irishmann,