Archived

This topic is now archived and is closed to further replies.

  • 0

Overflow of content in a ContentBox

Question

Posted · Report post

Hi, 

How do you ensure that the content placed inside a ContentBox will not overflow outside the defined ContentBox area when you resize the page?

Attached images for desired layout and layout on window resize. 

Each of the grey boxes is a ContentBox. 

Thanks much.

Vj

post-7772-0-16459000-1357755993_thumb.pn

post-7772-0-80381800-1357756000_thumb.pn

Share this post


Link to post
Share on other sites

7 answers to this question

Posted · Report post

I haven't hard coded font sizes in CSS for the text in the ContentBox on the top. However, the content from the top box is overflowing.

I have hard coded icon sizes that appear in the lower ContentBox. 

Any suggestions?

Share this post


Link to post
Share on other sites

Posted · Report post

Have you manually set the height of the widget using css?

 

Try applying your css to the below id and class instead of your custom class, see if that makes a difference, its slightly higher up in the hierarchy.

#contentbox .clone_4 { background-color: #F0F0F0;
    border-bottom: 1px solid #C3C8CC;
    border-radius: 2px 2px 2px 2px;
    box-shadow: 0 1px 1px rgba(0, 0, 250, 0.1);}

Share this post


Link to post
Share on other sites

Posted · Report post

Hi James, that did not work.

Any ideas?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

I am certain this issue is related to your custom CSS/HTML used in the ContentBox. Also, why not simply use a text widget instead of cloning a ContentBox several times.

 

I recommend you review your HTML/CSS, as I used a simply text widget and a ContentBox and I had no issue resizing my content, which never overflowed.

Share this post


Link to post
Share on other sites

Posted · Report post

Can you please post a link to your site?

Share this post


Link to post
Share on other sites

Posted · Report post

If you've set the fonts using css and a static font size (12pt etc) then they will remain at that size when on a responsive layout which could push them out of the frame. I think you'd be better to use em or percentages for the font sizes.

Share this post


Link to post
Share on other sites