Blog coding and discussion of coding about JavaScript, PHP, CGI, general web building etc.

Monday, February 15, 2016

What is user agent stylesheet

What is user agent stylesheet


I'm working on a web page in Google Chrome. It displays correctly with the following styles.

table {      display: table;      border-collapse: separate;      border-spacing: 2px;      border-color: gray;  }  

It is important to note that I didn't define these styles. On Chrome dev tools, it says 'user agent stylesheet' in place of the CSS file name.

Now if I submit a form and some validation error occurs, I get the following stylesheet:

table {      white-space: normal;      line-height: normal;      font-weight: normal;      font-size: medium;      font-variant: normal;      font-style: normal;      color: -webkit-text;      text-align: -webkit-auto;  }  table {      display: table;      border-collapse: separate;      border-spacing: 2px;      border-color: gray;  }  

The font-size from these new styles is disturbing my design. Is there any way to force my stylesheets and if possible, completely overwrite Chrome's default stylesheet?

Answer by BenM for What is user agent stylesheet


Define the values that you don't want to be used from Chrome's user agent style in your own CSS.

Answer by ols_87 for What is user agent stylesheet


What is the target browser? Different browsers set different default CSS rules. Try including a reset.css or a normalise.css (Google for either one or for "reset vs normalise" to see the differences) to remove those defaults.

Answer by Jukka K. Korpela for What is user agent stylesheet


Regarding the concept ?user agent style sheet?, consult section Cascade in the CSS 2.1 spec.

User agent style sheets are overridden by anything that you set in your own style sheet. They are just the rock bottom: in the absence of any style sheets provided by the page or by the user, the browser still has to render the content somehow, and the user agent style sheet just describes this.

So if you think you have a problem with a user agent style sheet, then you really have a problem with your markup, or your style sheet, or both (about which you wrote nothing).

Answer by rollin_jeksun for What is user agent stylesheet


Some browsers use their own way to read .css files. So the right way to beat this: If you type the command line directly in the .html source code, this beats the .css file, in that way, you told the browser directly what to do and the browser is at position not to read the commands from the .css file. Remember that the commands writen in the .html file is stronger than the command in the .css.

Answer by Daniel for What is user agent stylesheet


Marking the document as HTML5 by the proper doctype on the first line, solved my issue.

  ...  

Answer by Jesper Mygind for What is user agent stylesheet


To extend on Daniel's answer (my reputation is too small to simply comment). If is missing in your html you may experience that the browser gives preference to the "user agent stylesheet" over your custom stylesheet. Adding the doctype fixes this.

Answer by Srikanth for What is user agent stylesheet


put the following code in your CSS file

table {      font-size: inherit;  }  


Fatal error: Call to a member function getElementsByTagName() on a non-object in D:\XAMPP INSTALLASTION\xampp\htdocs\endunpratama9i\www-stackoverflow-info-proses.php on line 72

0 comments:

Post a Comment

Popular Posts

Powered by Blogger.