Relative values
The first, and one of the easiest ways, is to
avoid using fixed values in your widths. Using a relative value such as a percent (%) makes it such that it adjusts to the size of the screen you're viewing it from.
The drawback: What may look good on a standard screen may look awkward and full of unwanted space on a larger screen. I find that it's harder to control the layout when using a percentage value for my outermost container.
max-width
My
very unfinished and almost abandoned div guide in my Playground explains what max-width and how to use it here on Iwaku. c:
Most, if not all, my mobile friendly codes have a max-width in their outermost container.
Flexboxes
A bit of a more complicated option, but it's another that I would recommend.
Flexboxes help with layouting your divs. For example, if tou have a four column layout, it'd be pretty hard to read the text when you're on mobile. It'll be all squished up together, possibly to the point that only one word will show per line. It gets worse when a padding is added into the mix. With flexboxes, you can keep the four column layout when you're on desktop, but wrap when you view it on mobile.
The pinned post in my Playground is a live sample of what I mean. It aint no four column layout, but it should be enough to get the point across.
You can learn more about flexboxes in this handy little resource right
here