Why is the "width" property in CSS not working?

Question

So when I change the width on my website it doesn't work I've tried changing position but it just will not work

HTML and CSS:

.wrapper-main{
  display: block;
  height: 54%; !important
  width: 0px;
  background-color: #fff;
  margin-bottom: 15%;
  text-align: center;
  vertical-align: middle;
}

<div class="wrapper-main">
        <section class="section-default">
            <h1 class="header">Signup</h1>
            <form action="includes/sign-up.inc.php" method="post">
             <label for="username" id="label">Username</label><br>
                <input  type="text" id="username" placeholder="Username goes here.">
                <br><br>
                <label for="e-mail" id="label">E-mail</label><br>
                <input  type="text" id="e-mail" placeholder="E-mail goes here.">
                <br><br>
                <label for="pwd" id="label">Password</label><br>
                <input  type="password" id="pwd" placeholder="Password goes here.">
                <br><br>
                <label for="password" id="label">Password</label><br>
                <input  type="text" id="pwd-repeat" placeholder="Password goes here.">
                <br><br>
                <button type="Submit" name="signup-submit">Signup</button>
            </form>
        </section>
    </div>

the code is not enough to debug and understand your problem. — Kunal Tanwar, Aug 19 '21 at 13:32
@KunalTanwar I debugged the code just fine. Take a look at my answer below. — , Aug 19 '21 at 16:04
@Nishant That is not the problem. No matter what you set `width` to, it won't change the result. — , Aug 19 '21 at 16:05

score 0 · Answer 1 · answered Aug 19 '21 at 15:58

0

The problem is that the width value and !important value is, in this case, is invalid.

As you can see in the picture the property is invalid. Try to give width to a text form rather than a <div>.

answered Aug 19 '21 at 15:58

score 0 · Answer 2 · answered Aug 19 '21 at 15:58

0

Because you miss ; after your !important;

  height: 54% !important;
  width: 100px;

answered Aug 19 '21 at 15:58

This is incorrect. The browser marks the `!imortant;` as invalid. You did fix the width property though. – Aug 19 '21 at 16:00
you need to check this out once : https://stackoverflow.com/a/5658062/16639239 – Aug 19 '21 at 16:11

Why is the "width" property in CSS not working?

2 Answers2