> Somehow I do not seem to have come across this problem before. I have two > divs, one contained within the other. If the viewport of the browser is > resized to be smaller than the contents of the inner div, the inner div > sticks out the side of the outer container div, which continues to resize > with the browser. > > Surely the outer div should stop shrinking when it reaches the width of its > inner div, even if the viewport continues to be shrunk?
This is actually normal behaviour (apart from earlier IE browsers). Containers that are not given a set width will collapse based on the width of the viewport (or based on any containing box. However, if you have a parent element with no width defined, and a child element with a width defined, the child element may poke out the sides (or remain "visible") of the parent element. This is because the default overflow behaviour of the DIV element is "visible". > How can I fix this so that the outer div will not become any smaller than the > width of its inner div, when the width of the inner div will be unknown? Well, there are all sorts of options here, depending on your need. 1. You could set the parent container to a size that is equal or larger than the child element. 2. You could set the child element to a percentage width so that it would never become larger than the parent. 3. You could sent the parent with some sort of overflow - such as hidden or auto - to hide aspects of the child element (the aspects that appear outside the parent element). A lot comes down to what you want to achieve... HTH Russ ******************************************************************* List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *******************************************************************
