tlačidlá automatického zmenšenia veľkosti pre citlivý dizajn - css, zmena veľkosti, citlivý dizajn

Existuje spôsob, ako mať tlačidlá, ktoré automaticky upravujú veľkosť tak, aby sa zmestili na nádobu, aby mohli mať responzívny dizajn?

Bolo by ešte lepšie, ak si myslím, že existuje prístup, ktorý nie je založený na mediálnych dotazoch (= menší kód)

Dúfam, že vám obraz pomôže. Tu je CSS pre tlačidlo

.formButtonfront {
width: auto;
border:1px solid gray;
border-radius:7%;
float:right;
font-size:0.875;
}

Prehliadač je prehliadač Chrome v prenosnom počítači

Chcem, aby sivé tlačidlo (umiestnené za obrázkom) vyhovovalo bielej nádobe

Vopred ďakujem

PS O plaváku: Mám a clear:both; v päte. Aj keď odstránim plavák, výsledok je rovnaký.

UPDATE Tu je a jsfiddle

odpovede:

Takže to nepotrebujete display: block alebo float: none, ale a max-width

.formButtonfront {
border:1px solid gray;
border-radius:7%;
font-size:0.875;
word-wrap: break-word;
width: 100px; // only for IE8
max-width: 100%;
}

Pozri sa na toto husle (Zmenšujem veľkosť obsahu, aby som videl, ako vyzerá)

urobiť float: none a display: block pre to tlačidlo.

Vytvorí gombík ako kontajner a zapadne do nadradeného boxu.

Myslím, že vám to pomôže.