+ 1

Browsers

Why doesn’t my code match other websites when I look up my width and my height of my browser? https://code.sololearn.com/W6oNpHmkdVrc/?ref=app

9th Feb 2022, 2:27 AM
Junior
Junior - avatar
17 Answers
+ 2
In this case, you don't need onload. I hope my code helps in understanding the sizes: https://code.sololearn.com/Wu7D6rBUIqmy/?ref=app
9th Feb 2022, 5:02 AM
Solo
Solo - avatar
+ 1
The DOM structure was not completely loaded when you try to change width_height.innerHTML property. More about this here ... https://www.sololearn.com/post/90825/?ref=app
9th Feb 2022, 3:29 AM
Ipang
+ 1
So should i put the script at try the end of the body tag? Ipang
9th Feb 2022, 3:33 AM
Junior
Junior - avatar
+ 1
It is an option yes, but you can work around this by wrapping your JS code inside a "window.load" event handler. window.onload = () => { // move your JS code here ... }
9th Feb 2022, 3:36 AM
Ipang
+ 1
Could it also be because of my meta viewport does it matter if i add in a content(height=device-height)?
9th Feb 2022, 3:39 AM
Junior
Junior - avatar
+ 1
Nope, that meta has nothing to do with this. I think it's more closely related to how the page be displayed, in terms of responsiveness, like how adaptive it is when being displayed in various device screen size.
9th Feb 2022, 3:42 AM
Ipang
+ 1
Yea, thats kind of the point, it works bow but only the first time which is the problem
9th Feb 2022, 3:43 AM
Junior
Junior - avatar
+ 1
BTW ... you can have that code inside JS section. No need to put it within a script block inside HTML section.
9th Feb 2022, 3:50 AM
Ipang
+ 1
Your Mom, I have posted a question in regards to screen orientation changes. If you want the code to also update when the screen orientation changes, and if you're interested, Solomoni Railoa helped me out with an example there. https://www.sololearn.com/Discuss/2979507/?ref=app
9th Feb 2022, 9:54 AM
Ipang
+ 1
Okay, but why whenever you click the run button multiple times it changed your screen size and width? Ipang Solo And its only my height thats changing not my width
9th Feb 2022, 1:28 PM
Junior
Junior - avatar
+ 1
Don't know exactly what you mean It's not happening for me, in the updated code screen size and orientation shows up correctly. I test ran it many times. https://code.sololearn.com/WRTsbf87IS4u/?ref=app
9th Feb 2022, 1:38 PM
Ipang
+ 1
window.innerHeight shows the actual size of the window when the application was loaded, that is, if you performed some manipulations with the code using the keyboard and launched the application, then the window size will be equal to the screen size minus the keyboard size minus the SoloLearn top field size. You can check this in my code: "measure the centimeter indicated there with a ruler and if it is true, then you can safely measure all visible fields and check with the number of pixels." I also recommend uncommenting the lines in css one by one and see what happens.
9th Feb 2022, 2:09 PM
Solo
Solo - avatar
+ 1
What exactly? ☺️ Are you about the sizes you indicated? So I don’t know the dimensions of your device and the manipulations that you carry out. It's up to you to tell me whether it works or not ☺️
9th Feb 2022, 2:36 PM
Solo
Solo - avatar
+ 1
David Dolejší, the value of initial-scale depends on the individual settings of the user device, for example, the code I did for my device works perfectly, but for you there may be an error of 0.54, since I have initial-scale = 1.54
11th Feb 2022, 12:50 AM
Solo
Solo - avatar
0
Like the height will keep going to 553 or 448 and 1024
9th Feb 2022, 2:11 PM
Junior
Junior - avatar
0
So it is working? Solo
9th Feb 2022, 2:26 PM
Junior
Junior - avatar
0
Better to not onload from inline scripting..for some reason onload does not run well with incompatiable browsers which you should take into consideration. Alot of people do not update their devices regularly so as devs we have to create scripts to help make incompatible devices load the content in the perfered manner.
9th Feb 2022, 11:42 PM
Phillip Scott
Phillip Scott - avatar