Ask coding questions

← Back to all posts
How to make a program fit on all device size in css and html
MikeJMS8910 (234)

I created a code in html, css, and javascript but noticed that sometimes the design could be all messed up depending on the size of the device. So is there anyway I can make it fit on all screen sizes?

Answered by badst (240) [earned 5 cycles]
View Answer
Comments
hotnewtop
badst (240)

set the width to a percent :)

MikeJMS8910 (234)

@pepelaugh I did that but the font is the thing that is really messed up because you cant give a percent for that

Baconman321 (1103)

If you really can't use percentages and such, you could use a media query. More here!

Coder100 (18873)

sure, you can add breakpoints so you can change the styling on different sizes. This is what most developers use anyways.

https://www.w3schools.com/css/css_rwd_mediaqueries.asp

btw this is called responsive design

RYANTADIPARTHI (6019)

You could use the builtin window height and window width

RYANTADIPARTHI (6019)

@MikeJMS8910 maybe like this:

function openWindow() {
  myWindow = window.open("", "", "width=100, height=100");  
}

function resizeWindow() {
  myWindow.resizeTo(250, 250);                             
  myWindow.focus();                                        
}

like that.

MikeJMS8910 (234)

@RYANTADIPARTHI but I would want it to fit 100% and all of the window sizes could be different

badst (240)

@RYANTADIPARTHI wtf.... use css for this not js.

badst (240)

@MikeJMS8910 i was talking about @.RYANTADIPARTHI