Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
tbartolen
Člen
Avatar
tbartolen:31.7.2015 16:53

Tak jsem narazil hned na další problém....=) pořád jsem u stylování toho formuláře...Dal jsem pod sebe dvě tabulky, protože pokud bych to nechal v jedné, tak se mi v zavislosti na manualním zvětšování textarea bude rozjíždět celá tabulka. Problém ted je, že element <td> samozřejmě není stejný jako u tabulky nad tím...Dá se nějak nastavit závislost, aby ta druhá tabulka dědila velikosti té první? Inherit? jak s tím pracovat? Když napíšu pouze podruhé

td {width: inherit }

tak to nepujde, to je podle mě blbost. A další věc, pokud bych nastavil velikost napevno, jako to mám u input a textarea, tak by to mělo být v pořádku, ale co potom s media queries?

<form method="POST">
            <table>
                <tr>
                    <td>Vaše jméno</td>
                    <td><input name="jmeno" type="text" value="<?= htmlspecialchars($jmeno) ?>"/></td>
                </tr>
                <tr>
                    <td>Váš email</td>
                    <td><input name="email" type="email" value="<?= htmlspecialchars($email) ?>"/></td>
                </tr>
                <tr>
                    <td>Aktuální rok</td>
                    <td><input name="rok" type="number" /></td>
                </tr>
                <tr>
                    <td>Telefonní číslo</td>
                    <td><input name="cislo" type="number" /></td>
                </tr>

            </table>
            <!--<div class="zprava">-->
            <table>
                <tr>
                    <td>Vaše Zpráva</td>
                    <td><textarea name="zprava"><?= htmlspecialchars($zprava) ?></textarea></td>
                </tr>
            </table>

            <br />

            <input type="submit" value="Odeslat" />
             </div>
        </form>

CSS

/*stylování tabullky v emailu*/
form {
    width: 100%;
    }
    form p {
        text-align: center;
    }
table {
   /* float: left;´*/
    padding-left: 50px;
}
table, td  {
    border: 1px solid #000000;
    width: auto;
}
table td   {
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 10px;
    width: auto;

}
table input {
    width: 400px;
    height: 50px;
    border-radius: 2px;
    font-size: 25px;
}
Odpovědět
31.7.2015 16:53
Navštiv www.fb.com/skkelticz
Avatar
Odpovídá na tbartolen
Neaktivní uživatel:31.7.2015 19:44

Ahoj, vyzkoušej dát vše do jedné tabulky (ne do dvou) a textareře nastavit tuto vlastnost. Způsobí to, že bude roztažená naplno stejně jako ostatní inputy a budeš jí moct roztahovat jen vertikálně.

textarea {
    width: 100%;
    resize: vertical; /* Pouze vertikální změna rozměrů */
    /* Šířka elementu se bude brát podle celého elementu, ne podle obsahu. Jinak by to mírně vyčnívalo.  */
    webkit-box-sizing: border-box;
    moz-box-sizing: border-box;
    box-sizing: border-box;
}
Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
Nahoru Odpovědět
31.7.2015 19:44
Neaktivní uživatelský účet
Avatar
tbartolen
Člen
Avatar
Odpovídá na Neaktivní uživatel
tbartolen:31.7.2015 22:36

Paráda, děkuji moc, responzivitu jsem vyřešil pomocí posuvníku

.posuvniktabulky {
    max-width: 100%;
    overflow: auto;
}
Nahoru Odpovědět
31.7.2015 22:36
Navštiv www.fb.com/skkelticz
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 3 zpráv z 3.