Home/ Questions/Q 6577679
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T15:40:07+00:00

I have following textbox in my first HTML page: <input tabindex=4 type=text class=search_textbox roundedCorners

  • 0

I have following textbox in my first HTML page:

<input tabindex="4" type="text" class="search_textbox roundedCorners" id="search_query" name="search_query"/>

.roundedCorners{        
  border:1px solid black;
  padding-left: 5px;
  padding-right: 5px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}
.search_textbox {
  position: absolute;
  width: 187px; 
  height: 21px;    
  left: 96px;
  top: 96px;    
  padding-right: 29px;
  padding-left: 48px;
}

When I see it in the browser, in the first page the “final” width of search_textbox is 187+48+29=264px. But when I insert the same thing in the second page and open it with the same browser the “final” width of search_textbox is only 187px.

I am testing it in Chrome and Mozilla. All of them show exactly the same picture.

Why? Am I doing something wrong or what?

UPDATE 1

I have noticed that in the second page Chrome is adding following style automatically, while in the first page it is not adding it:

input:not([type="image"]), textarea {                    user agent stylesheet
  -webkit-box-sizing: border-box;
}

I think this property is causing this error with the width, right? But I have searched in all my .css files and couldn’t find that property at all. How Chrome is adding that property itself in one page and not adding in another page?

UPDATE 2

I have solved the problem. I have noticed that in the first page I had <!DOCTYPE html> statement but in the second one no, so once I have added that statement into the second page the problem has been solved. But still I just wonder why?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Seeing as you’ve fixed your problem, this answer is a little superfluous, but whatever 🙂

    You probably know this already, but the textareas width of 187px is the default for your browser, which leads us nicely on to my next paragraph.

    The reason CSS styles aren’t fetched and parsed by a document with no doctype is due to the fact that, technically, it’s not a valid document. Once you add the doctype, problem solved.

    • 0