Set max height or limit dynamic content on phoenix raw?

Phoenix Forum Questions / Help
,
1

I have the following rendering dynamic HTML content in my template

<div class="well" style="max-height:300px">
  <%= raw( Earmark.as_html! (magnet.content) ) %>
 </div>

I’m trying to either set a max height on the HTML element which is not working on set the max amount of content magnet.content outputs in JS I would use underscore.string using truncate(string, length, [truncateString = '...']) => string

As you can see my issues

25%20PM
25%20PM2272×882 83.2 KB

47%20PM
47%20PM2228×1076 89.2 KB

2

max-height seems to be working fine, it’s the content inside of it which leaks out. Can you modify the contents of raw? Or add more styling to the parent div to force the child not to overflow.

3

I tried adding max-height to the parent div that did not work and I can’t change the content which is why I was looking for something like truncateString

4

I got it working need to set overflow: hidden;

1 Like
5

Truncating the content would not work just like that because it’s HTML and it might be cut in the middle of a tag, leading to broken markup.

6

Thanks got it working