How can I make my personal website responsive across different devices?

Don't stress too much if you’re just experimenting; almost every newbie hits this roadblock. Look into 'Responsive Design'—it’s essential for developers. You typically want to create designs for mobile, tablet, and desktop views. Try visiting popular sites and resize your browser window to see how they adjust—this will give you an idea of a mobile layout at minimum width.

Seriously, using pixels for padding and margins is a rookie mistake that can mess up your site's responsiveness. Real developers use rem and set a proper root font size. If you're still using px in the future, your site will look outdated!

It sounds like you developed your site mainly for your PC's resolution. To ensure it looks good on other devices, you should learn about responsive design and media queries. They really help adjust your layout based on different screen sizes. Check out this guide on media queries for more info: https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Media_queries/Using

That’s a common issue for beginners! Instead of trying to calculate sizes for every screen, consider using Flexbox or Grid for layout. Switch to using relative units like rem or percentages instead of pixels. Media queries are great for handling breakpoints to adjust spaces and font sizes. Plus, use your browser's dev tools in device mode to test different screen sizes without needing other devices!

You can right-click on your PC and select 'Inspect Element' or open the dev tools to see how your webpage looks across different dimensions. It’s a handy way to troubleshoot responsiveness.