Jump to content
Sign in to follow this  
VJG

Overflow of content in a ContentBox

Recommended Posts

VJG    0
VJG

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
James B    436
James B

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.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
VJG    0
VJG

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
James B    436
James B

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);}

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
VJG    0
VJG

Hi James, that did not work.

Any ideas?

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

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.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×