CODEWITHSUNDEEP
htmlcss
Aayush More
Aayush More

Reputation: 3

How can i scale a div on page zoom in or zoom out in chrome but i want only that div to be fit

How can i scale a div on page zoom in or zoom out in chrome but i want only that div to be fit like this button is going below the page when page is zoomed

Upvotes: -2

Views: 26

Answers (1)

Vishesh
Vishesh

Reputation: 18

I am not exactly sure what you are asking, but I think you want a <div> to resize depending on the browser window size.

This can be solved by adding a width = 100% and height = auto to your styles.css file. However, you can set the percentage to whatever you want, as this is the percentage relative to the screen width.

Here is an example on how that will look.

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <title>My Site</title>
    <link rel="stylesheet" href="styles.css">
</head>

<body>
<!-- your code... -->

    <div class="resize-div">
    <!-- your code inside the div... -->
    </div>

<!-- the rest of your file... -->

</body>
</html>

/* styles.css */

.resize-div {
    width = 100%;
    height = auto;
}

If, for whatever reason, you don't want/have a styles.css file, you can simply add a style = "" tag to your index.html.

Here's an example on how that will look.

<!-- index.html -->

<!DOCTYPE html>
<html lang="en">
<head>
    <title>My Site</title>
</head>

<body>
<!-- your code... -->

    <div style = "
    width = 100%;
    height = auto;
    ">
    <!-- your code inside the div... -->
    </div>

<!-- the rest of your file... -->

</body>
</html>

Upvotes: 0

Related Questions