NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!

Diskuze: Textarea na šířku stránky

V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity
Avatar
Marek Vach
Člen
Avatar
Marek Vach:27.4.2015 11:02

Ahoj,
potřeboval bych pomoct s napasováním CSS na HTML formulář. Ve formuláři mám <textarea> po kterém chci, aby byl na plnou šířku stránky. To celé chci mít v jednom souboru.
První odkaz z googlu vyhodí tohle CSS, které vypadá slibně:

.boxsizingBorder {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

A tady je můj marný pokus, jak to napasovat na HTML :D

<style type="text/css">
.boxsizingBorder {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
</style>

<form method="post" action="">
      <h6><label for="notes">Místo na poznámky</label></h6>
      <div id="boxsizingBorder"><textarea id="notes">hello world</textarea></div>
</form>

Kdyby to někdo poupravil, aby to šlo jen zkopírovat a použít, byl bych vděčný ;)

Editováno 27.4.2015 11:06
 
Odpovědět
27.4.2015 11:02
Avatar
michformanek
Člen
Avatar
michformanek:27.4.2015 11:28

Nezkoušel jsem, každopádně zaměnit ID za CLASS

 
Nahoru Odpovědět
27.4.2015 11:28
Avatar
michformanek
Člen
Avatar
michformanek:27.4.2015 11:35

A taky určit šířku.

textarea {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;

        width: 100%;
}
Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
 
Nahoru Odpovědět
27.4.2015 11:35
Avatar
Marek Vach
Člen
Avatar
Odpovídá na michformanek
Marek Vach:27.4.2015 12:27 
<style type="text/css">
textarea {
       -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
       box-sizing: border-box;
       width: 100%;
}
</style>

<form method="post" action="">
      <h6><label for="notes">Místo na poznámky</label></h6>
      <div class="textarea"><textarea id="notes">hello world</textarea></div>
</form>

Funguje, Díky!

 
Nahoru Odpovědět
27.4.2015 12:27
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.