Hello all. I am about done with my Technical Document page and would like to get some feed back on design issues. I have only been able to test it on a few devices and browsers so I’d like to know how bad it may look on other devices.
I have not passed all the test yet to submit it and plan to make some fixes to the html tomorrow to get it submitted.
https://codepen.io/jfirestorm44/full/oNbqmzB
Thank you in advance!
Hi, I took a quick look and there is content that is not responsive. There are boxes with a gray background in which the content comes out of it on small screens. I tested it in chrome.
I hope the opinion will serve you. Regards!
Ok thanks for that. I’ll try to manipulate the zoom some more to see exactly what you’re talking about. What size screen are you using or how far did you zoom in?
no need to zoom. press
control shift m
in firefox (or similar in chrome) to get into responsive mode
The screen of my cell phone is 360x720, I also tested it on my notebook in the google browser with the resposive tool and the same error occurs.
I can’t, for the life of me, figure out how to fix it. I can see it spilling out in the developers tool in mobile view mode. I have added word-wrap: break-word; to that section, then to the list, then to that element. I also added it globally to the * area.
For whatever reason I can’t figure out why it won’t display properly. I have an iphone Max and it looks great on Chrome, Edge, and Safari.
Any ideas?
Found a solution. Looks better now.
https://www.tutorialspoint.com/How-do-I-wrap-text-in-a-pre-tag-in-HTML
Thanks for the tip on that tool! I’ll be using it all the time now instead of jumping to my phone constantly.
Now it looks perfectly. Congratulations! Today I have to start with this project, we will see what surprises I find. Regards!
