Submitted
Hi everyone,
I have a couple of issues.
First, when I use a media query to adjust the CSS for mobile devices and I try to set a max screen size, it then seems to work just fine while I check on my desktop computer and adjust the browser window to simulate having a smaller screen. But once it's all done and the final result is published, I then use my actual phone to check and it will display the layout designed for much larger screen sizes. When I check my phone's settings, it says that the screen resolution is 1920x1080. But obviously my phone's screen is actually way smaller than the browser window on my PC, even when the latter is set to something like 600px x 900px. So I wonder whether there is a better way to make the CSS responsive for mobile devices using not the screen's resolution but its actual size.
Secondly, I had some difficulty making the output section of the calculator (i.e. the right half which includes the resulting tip per person and the total amount etc.) look neat. So I eventually reverted to making the whole section into a table. If I remember correctly, once upon a time, I read that you shouldn't use this workaround for anything other than actual tables. So I wonder, my way of using an HTML table to make sure all the different headings and resultes and so on look nice in order, is this something that is acceptable among professional developers or is it frowned upon?
Cheers for any feedback!
