---
title: "Why are use the width() and height() in JQ?"  
description: "Why are use the width() and height() in JQ?"  
author: "Ethan Karla"  
published: 2021-07-28  
canonical: https://answers.mindstick.com/qa/93817/why-are-use-the-width-and-height-in-jq  
category: "web application"  
tags: ["web programming", "web application development", "web development services"]  
reading_time: 2 minutes  

---

# Why are use the width() and height() in JQ?

Why are use the width() and height() in JQ?

## Answers

### Answer by Ravi Vishwakarma

jQurery width() method use to get and set the width of selected element.

```
Syntax:$(selector).width()return the current width of selected element$(selector).width(current width);set the current width on selected element$(selector).width(function(index, current width))and also this signature used to set the current width on selected elements
```

Example:

```
<!DOCTYPE html>
<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
    <meta charset='utf-8' />
    <title></title>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
    <script type='text/javascript'>
        $(document).ready(function () {
            $('#get').click(function () {
                alert('Witdh : ' + $('div').width()+' px');
            });
            $('#set').click(function () {
                $('div').width('100%');
                $('div').text(' div width is 100% of any size ');
            });
        });
    </script>
    <style>
        body {
            margin:10px;
            padding:10px;
        }
        div {
            background-color:cyan;
            height:120px;
            width:50%;
            color:white;
            text-align:center;
            font-size:40px;
        }
    </style>
</head>
<body>
    <button id='get'>Click Me</button>&nbsp<button id='set'>Set width 100%</button> <br /><br />
    <div>
        this is div and div width is 50% of any size
    </div>
</body>
</html>
```

Output:

![Why are use the width() and height() in JQ?](https://answers.mindstick.com/QuestionAnswer/04b3ec32-0fd2-4224-9c0b-0c21278e6188/images/8edad056-d251-4ca1-bb45-a13d5751dfdd.png)

\


---

Original Source: https://answers.mindstick.com/qa/93817/why-are-use-the-width-and-height-in-jq

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
