How to make a container any size?

I assume your container just becomes too small to keep all the elements inside in their place... Maybe you can post your code here, so we can have a closer look at the issue?

Hey, Lindsay.

It sounds like what you're running into is you're resizing the container, but the contents are staying the same size and wrapping differently based on the new size of the container.

What you want to do conceptually is resize each of the elements within the floating container so they keep their proportion.

You'll set up breakpoints so that when you hit a certain size, you change the CSS properties of the container and it's contained elements.

For example, let's say you start with your floated container and it's at 100% width. It contains a paragraph with a font-size set to 2em and an image with a width of 200px floated to the right.

When you set your breakpoint for the floated container to be at 50% width, you would change the paragraph font-size to 1em (50% of the original size) and the image width to 100px (50% of the original size). You would also need to scale any white space.

Thanks Rob, I have attached the code with the sample images. Example 1 is what I am trying to achieve, example 2 is currently what is happening.

I want to make the "box2" element bigger, but the text keep moving down if I I floated the class. So I changed the the class "box2" to inline block to maker it bigger with padding, but now the text and photo are staying below instead of expanding with the background.

My Code: https://w.trhou.se/v2pmfmvcey

Thank you for your help!