Wed, 2018-11-07 15:04
Hi Friends,
I've a template native css class for button, and would like to insert two texts in the button, the first text can use the template classes, for the second text (which is a disclaimer) I would like set carriage return and smaller text.
The page is this: https://www.staccoexperience.com/home/experience/
and the button should be so: https://ibb.co/iGp2sq
Actually I've customized the button only here:
.button.colored.outline, .button.colored.solid:hover { color: #fff; } .button.colored.outline { background-color: #cf9f24; } .button.colored.outline:hover { background-color: transparent; } .button.colored.outline:hover { color: #cf9f24; font-weight: bold; } .button, button, input[type="submit"] { padding: 20px 40px 20px 40px; }
What is for you the better way?
Many thanks!
Davide
Sat, 2018-11-10 00:13
#1
Two font sizes
Is this what you're looking for?
<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"> <meta content= "width=device-width, height=device-height, initial-scale=1" name="viewport"> <title> Test document </title> <style media="screen"> /*<![CDATA[*/ body, html { font: 100%/1.5 sans-serif; margin:0; padding: 0; } p { font-size: 1em; margin-bottom: 0; } h1, h2, h3 { font-family: serif; } h1 { text-align: center; text-transform: capitalize; } /* end boiler plate */ button span#fineprint { display: block; font-size: xx-small; } /*]]>*/ </style> </head> <body> <h1> One button — two font sizes </h1> <button>line one<span id="fineprint">*line two</span></button> </body> </html>
gary