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

Člen
Avatar
:31.1.2014 20:14

Nevíte někdo co na tom mám špatně? V každém prohlížeči se to zobrazuje jinak. Např.: v ei je tlačítko menší než má být a v Chromu je textarea větší než inputy. Jen ve firefoxu se zobrazuje správně.
HTML:

<form method="post">
                                                                                <table>
                                                                                        <tr>
                                                                                                <td><input class="policka" type="text" name="jmeno" required="required" placeholder="Jméno" value="<?= htmlspecialchars($jmeno) ?>" /></td>
                                                                                        </tr>
                                                                                        <tr>
                                                                                                <td><input class="policka" type="email" name="email" required="required" placeholder="E-mail" value="<?= htmlspecialchars($email) ?>" /></td>
                                                                                        </tr>
                                                                                        <tr>
                                                                                                <td><input class="policka" name="rok" type="number" required="required" placeholder="Aktuální rok (spam kontrola)"/></td>
                                                                                        </tr>
                                                                                        <tr>
                                                                                                <td><textarea name="zprava" required="required" placeholder="Obsah zprávy"><?= htmlspecialchars($zprava) ?></textarea></td>
                                                                                        </tr>
                                                                                        <tr>
                                                                                                <td><input id="form_tlacitko" type="submit" value="Odeslat"/></td>
                                                                                        </tr>
                                                                                </table>
                                                                        </form>

CSS:

form table {
        position: relative;
  }

.policka {
        color: #0078A6;
        width: 400px;
        height: 25px;
        border: 2px solid #B3B3B3;
        transition: border 0.5s;
        font-family: Georgia;
  }

.policka:hover {
        border: 2px solid #3098BF;
  }

table tr td textarea {
        color: #0078A6;
        width: 400px;
        height: 150px;
        border: 2px solid #B3B3B3;
        font-family: Georgia;
        transition: border 0.5s;
  }

table tr td textarea:hover {
        border: 2px solid #3098BF;
  }

#form_tlacitko {
        color: #FFFFFF;
        width: 404px;
        height: 50px;
        border: 0px solid #00BBFF;
        background-color: #00BBFF;
        font-family: Georgia;
        cursor: pointer;
        font-size: 17px;
        transition: background 0.5s;
  }

#form_tlacitko:hover {
        background-color: #3098BF;
  }
 
Odpovědět
31.1.2014 20:14
Avatar
Michal Žůrek - misaz:31.1.2014 21:10

Kdyby někdo ten první kód neviděl, tak musíte použít scrollbar.

 
Nahoru Odpovědět
31.1.2014 21:10
Avatar
Uživatel sítě :31.1.2014 22:29

Každý prohlížeč má jiné vlastnosti pro dané elementy, avšak ty si můžeš lehce přizpůsobit ke svému obrazu jako to má zde devbook ty modré buttony..

Často doporučuji hromadně dát nulovou hodnotu margin, padding a border.

tedy:

<style>
div, span, input, form, textarea {
    margin: 0;
    padding: 0;
    border: 0;
}
</style>

Například.. :)

Nahoru Odpovědět
31.1.2014 22:29
Chybami se člověk učí, běžte se učit jinam!
Avatar
Odpovídá na Uživatel sítě
Uživatel sítě :31.1.2014 22:32

Textarea má třeba ve výchozí hodnotě pro chrome padding 2px.

Nahoru Odpovědět
31.1.2014 22:32
Chybami se člověk učí, běžte se učit jinam!
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.