CODEWITHSUNDEEP
htmlcssbuttonstylesheet
ZeroSuf3r
ZeroSuf3r

Reputation: 2001

Chrome default button style

Is it possbile to get the default Chrome button style in CSS?

Of course many would say use http://pastebin.com/zjkW2cJe or http://pastebin.com/xKGBZFPg

But i want this button CSS code...

Upvotes: 4

Views: 13956

Answers (3)

CpnCrunch
CpnCrunch

Reputation: 5071

In current Chrome on macOS, it is something like this:

background-image: linear-gradient(to bottom, #e4e4e4, #f7f7f7);
border: 1px solid #afafaf

Upvotes: 0

Pekka
Pekka

Reputation: 449713

If you want the pure CSS rules, you can inspect the button element and check out the entries saying "user agent stylesheet".

In my Chrome 9, they look like this:

input, textarea, keygen, select, button, isindex, datagrid {
margin: 0em;
font: -webkit-small-control;
color: initial;
letter-spacing: normal;
word-spacing: normal;
....... etc. much more

however, if you literally want the rules for natively rendering a button, in order to render the same button in other browsers, I think that's impossible: A default button will be rendered by the Browser's UI or even the underlying operating system. In my Windows 7, the default button looks like this:

enter image description here

This style, as far as I know, is not in the CSS rules. You would have to rebuild it using background images, borders, rounded corners etc. If you don't mind using jQuery, libraries like jQuery UI have seducingly simple solutions for this.

Upvotes: 5

Capsule
Capsule

Reputation: 6159

You want them... visually? If so, inspect the element and look at the computed styles.

Upvotes: 3

Related Questions