[html] Making HTML page zoom by default

I've designed a page, where buttons look good when the browser zoom is at 90%, but by default other users view it at 100/125%+ in their browser which is resulting an overlap in buttons and input forms.

So, I want to set the zoom value as 90% by default when my JSP page loads.

How do I do this? After making any such setting can make the page non-zoomable? Or Is there any better solution for this?

This question is related to html css jsp

The answer is


Solved it as follows,

in CSS

#my{
zoom: 100%;
}

Now, it loads in 100% zoom by default. Tested it by giving 290% zoom and it loaded by that zoom percentage on default, it's upto the user if he wants to change zoom.

Though this is not the best way to do it, there is another effective solution

Check the page code of stack over flow, even they have buttons and they use un ordered lists to solve this problem.


In js you can change zoom by

document.body.style.zoom="90%"

But it doesn't work in FF http://caniuse.com/#search=zoom

For ff you can try

-moz-transform: scale(0.9);

And check next topic How can I zoom an HTML element in Firefox and Opera?


A better solution is not to make your page dependable on zoom settings. If you set limits like the one you are proposing, you are limiting accessibility. If someone cannot read your text well, they just won't be able to change that. I would use proper CSS to make it look nice in any zoom.

If your really insist, take a look at this question on how to detect zoom level using JavaScript (nightmare!): How to detect page zoom level in all modern browsers?


Questions with html tag:

Embed ruby within URL : Middleman Blog Please help me convert this script to a simple image slider Generating a list of pages (not posts) without the index file Why there is this "clear" class before footer? Is it possible to change the content HTML5 alert messages? Getting all files in directory with ajax DevTools failed to load SourceMap: Could not load content for chrome-extension How to set width of mat-table column in angular? How to open a link in new tab using angular? ERROR Error: Uncaught (in promise), Cannot match any routes. URL Segment Angular 6: saving data to local storage Vue.js get selected option on @change Bootstrap 4 multiselect dropdown How to add bootstrap in angular 6 project? Angular 5 Button Submit On Enter Key Press Angular 5, HTML, boolean on checkbox is checked How to render string with html tags in Angular 4+? bootstrap 4 file input doesn't show the file name How can I execute a python script from an html button? Bootstrap 4: responsive sidebar menu to top navbar Stylesheet not loaded because of MIME-type Force flex item to span full row width Failed to load resource: the server responded with a status of 404 (Not Found) css Change arrow colors in Bootstraps carousel Bootstrap 4 Dropdown Menu not working? CSS Grid Layout not working in IE11 even with prefixes How to prevent page from reloading after form submit - JQuery Centering in CSS Grid Detecting real time window size changes in Angular 4 Angular 4 img src is not found (change) vs (ngModelChange) in angular Bootstrap 4: Multilevel Dropdown Inside Navigation Align the form to the center in Bootstrap 4 How to style a clicked button in CSS How do I change the font color in an html table? Redirecting to a page after submitting form in HTML Load json from local file with http.get() in angular 2 display: flex not working on Internet Explorer Scroll to element on click in Angular 4 How to extract svg as file from web page force css grid container to fill full screen of device How does the "position: sticky;" property work? HTML5 Video autoplay on iPhone Disable button in angular with two conditions? CSS hide scroll bar, but have element scrollable CSS grid wrapping How to load image (and other assets) in Angular an project? Flask - Calling python function on button OnClick event How can I make Bootstrap 4 columns all the same height? Wrapping a react-router Link in an html button

Questions with css tag:

need to add a class to an element Using Lato fonts in my css (@font-face) Please help me convert this script to a simple image slider Why there is this "clear" class before footer? How to set width of mat-table column in angular? Center content vertically on Vuetify bootstrap 4 file input doesn't show the file name Bootstrap 4: responsive sidebar menu to top navbar Stylesheet not loaded because of MIME-type Force flex item to span full row width Font Awesome 5 font-family issue Failed to load resource: the server responded with a status of 404 (Not Found) css CSS class for pointer cursor How and where to use ::ng-deep? Styling mat-select in Angular Material What is the difference between CSS and SCSS? iPhone X / 8 / 8 Plus CSS media queries Change arrow colors in Bootstraps carousel Bootstrap 4 Dropdown Menu not working? Add class to an element in Angular 4 CSS Grid Layout not working in IE11 even with prefixes Search input with an icon Bootstrap 4 Bootstrap 4 - Inline List? Centering in CSS Grid Bootstrap 4, how to make a col have a height of 100%? Equal height rows in CSS Grid Layout Bootstrap 4: Multilevel Dropdown Inside Navigation Align the form to the center in Bootstrap 4 Customize Bootstrap checkboxes How to style a clicked button in CSS How can I get the height of an element using css only display: flex not working on Internet Explorer force css grid container to fill full screen of device How does the "position: sticky;" property work? bootstrap 4 row height Prevent content from expanding grid items Bootstrap 4 File Input CSS hide scroll bar, but have element scrollable CSS grid wrapping Bootstrap 4 Change Hamburger Toggler Color How can I make Bootstrap 4 columns all the same height? How to hide collapsible Bootstrap 4 navbar on click Bootstrap 4 Center Vertical and Horizontal Alignment Cannot read property 'style' of undefined -- Uncaught Type Error How to window.scrollTo() with a smooth effect Vertical Align Center in Bootstrap 4 How to implement a Navbar Dropdown Hover in Bootstrap v4? CSS change button style after click What is correct media query for IPad Pro? How do I specify row heights in CSS Grid layout?

Questions with jsp tag:

Difference between request.getSession() and request.getSession(true) A child container failed during start java.util.concurrent.ExecutionException The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path Using if-else in JSP Passing parameters from jsp to Spring Controller method how to fix Cannot call sendRedirect() after the response has been committed? How to include js and CSS in JSP with spring MVC How to create an alert message in jsp page after submit process is complete getting error HTTP Status 405 - HTTP method GET is not supported by this URL but not used `get` ever? How to pass the values from one jsp page to another jsp without submit button? Create a simple Login page using eclipse and mysql How to fetch the dropdown values from database and display in jsp How to pass a value from one jsp to another jsp page? Making HTML page zoom by default The server encountered an internal error that prevented it from fulfilling this request - in servlet 3.0 insert data into database using servlet and jsp in eclipse how to set the background image fit to browser using html Set textbox to readonly and background color to grey in jquery jQuery change event on dropdown Iterating through a List Object in JSP What is the difference between response.sendRedirect() and request.getRequestDispatcher().forward(request,response) java.lang.ClassNotFoundException: org.apache.jsp.index_jsp Passing ArrayList from servlet to JSP How is using "<%=request.getContextPath()%>" better than "../" How to upload files on server folder using jsp HTTP Status 500 - org.apache.jasper.JasperException: java.lang.NullPointerException Unable to compile class for JSP: The type java.util.Map$Entry cannot be resolved. It is indirectly referenced from required .class files How to display a database table on to the table in the JSP page How to get a index value from foreach loop in jstl Get value from hashmap based on key to JSTL Failed to start component [StandardEngine[Catalina].StandardHost[localhost].StandardContext[]] Redirect to an external URL from controller action in Spring MVC How to convert HTML to PDF using iText org.apache.jasper.JasperException: Unable to compile class for JSP: How to use session in JSP pages to get information? how to pass data in an hidden field from one jsp page to another? Pass Hidden parameters using response.sendRedirect() Using for loop inside of a JSP javax.servlet.ServletException cannot be resolved to a type in spring web app Spring,Request method 'POST' not supported Selected value for JSP drop down using JSTL how to open popup window using jsp or jquery? How to show form input fields based on select value? Can not find the tag library descriptor for "http://java.sun.com/jsp/jstl/core" org.apache.catalina.LifecycleException: Failed to start component [StandardEngine[Catalina].StandardHost[localhost].StandardContext[/CollegeWebsite]] How do I call a specific Java method on a click/submit event of a specific button in JSP? How to configure welcome file list in web.xml What's the difference between including files with JSP include directive, JSP include action and using JSP Tag Files? Adding external resources (CSS/JavaScript/images etc) in JSP How to get the selected value from drop down list in jsp?