TItle and overflow: hidden;?

The correct solution for the location of headline news?

.news1_title {
overflow: hidden;
}
d6prcn3t.jpg

.news1_title {
/* overflow: hidden; */
}
d6prcn7i.jpg
July 12th 19 at 17:12
2 answers
July 12th 19 at 17:14
Solution
It is better to use these styles:
hyphens: auto; // To work you need to add the lang="EN"
overflow-wrap: break-word; // because the previous style is not working in chrome and opera.


ffd6ef72002b4c81ba448ab953913c8a.PNG
not working - jessika.Hilll commented on July 12th 19 at 17:17
: here is an example https://jsfiddle.net/w41y22w8/1/
adds hyphens using hyphenation dictionary browser. Don't forget to add the language of the document

I.e. in your example will
criticizing-
senior
overflow-wrap will wrap words without a hyphen (a dash) where hyphens are not supported, i.e. there will be
raskritikovav
iy - sheldon_Kautzer73 commented on July 12th 19 at 17:20
in some cases, may not work? checked everything but still doesn't want to carry as the example - jessika.Hilll commented on July 12th 19 at 17:23
July 12th 19 at 17:16


<a href="#" class="news1 cf">
 <div class="news1_img">
 <div class="tile_bg" style="background-image:url();">
</div>
 <div class="tile">
</div>
</div>
 <div class="news1_title"><p class="news1_title">
 In Russia there is a bus loukoster </p>
 <div class="views">
103
</div>
</div>
</a>
More styles to see. Preferably on a site like jsfiddle.net or on the website, where all content - jessika.Hilll commented on July 12th 19 at 17:19
: it seems everything works as it should. The styles which I wrote need to be applied to the block with text. Example in the screenshot with my answer - sheldon_Kautzer73 commented on July 12th 19 at 17:22
and then I think why yours works, I test in Opera, there does not plow, and in mozille and in truth plow )) - jessika.Hilll commented on July 12th 19 at 17:25
: do you need to do cross-browser solution that would work everywhere.for Opera and chrome need to write overflow-wrap. But, in General,for me, it would be better to make the collection a little wider to fit the word reasonable long. - sheldon_Kautzer73 commented on July 12th 19 at 17:28
: I would love to, but it drew the layout of those people who don't understand anything - sheldon_Kautzer73 commented on July 12th 19 at 17:31

Find more questions by tags HTMLCSS