html - Set a % width for a link styled as button regardles of its text lenght -


I think the titles say all this. I want the CSS link style to look like a button. The code is:

  .botsup {padding: 5px; Background: # ffae00; / * Fallback for fallbackers that do not support gradients * / background: -WebKit-linear-gradient (top, #ffaax, #d67600); Background: -Mo-Linear-Slope (Top, # FFAAAIX, # D67600); Background: -O linear shield (top, # FFAACX, # D67600); Background: Linear-gradient (top, # FFAAA 200, # D67600); Border: 4px start # dd9d8; Border: 3px solid # 999; -Vibit-boundary-radius: 15px; -image-radius: 15px; Range radius: 20px; / * Button a drop shadow * / -webkit-box-shadow: rgba (0, 0, 0, .55) 0 1px 6px; -Moz-box-shadow: RGBA (0, 0, 0, .55) 0 1px 6px; Box-shadow: RGBA (0, 0, 0, .55) 0 1 px 6px; Text-decoration: none; Display area; Width: 82%; Line-height: 190%; Font-family: "Ariel"; Text align: center; Vertical-row: middle; Font-weight: boulder; Font-size: 98.5%; Color: Gray; }  

It works fine, but I want to set the button width in spite of its text length, and I want to do it by using insted% of PX.

Yes - there is.

Set:

  Display: Inline-block;  

Remove more

  width: 82%;  

New CSS:

  .botsup {padding: 5px; Display: Inline-block; Line-height: 190%; Font-family: "Ariel"; Text align: center; Vertical-row: middle; Font weight: 700; Font-size: 98.5%; Color: Gray; Background: #FFAAX; Background: -webkit-linear-shield (top, #ffaaax, #d67600); Background: -Mo-Linear-Slope (Top, # FFAAAIX, # D67600); Background: -O linear shield (top, # FFAACX, # D67600); Background: Linear-gradient (top, # FFAAA 200, # D67600); Border: 4px start # dd9d8; Border: 3px solid # 999; -Vibit-boundary-radius: 15px; -image-radius: 15px; Range radius: 15px; -WebKit-box-shadow: RGBA (0, 0, 0, .55) 0 1 px 6px; -Moz-box-shadow: RGBA (0, 0, 0, .55) 0 1px 6px; Box-shadow: RGBA (0, 0, 0, .55) 0 1 px 6px; Text-decoration: none; }  

Comments