Question

我有一个用css设计的表单。表单将提交到同一页面。当我发布表单时，文本输入字段看起来不同 - 顶部和底部的填充似乎消失了（虽然不是左右填充）。

但是，当我检查代码时，css值是相同的。除了文本输入字段外，一切看起来都应该如此。

表格的代码：

<div class="form mtop20">
<form action="" method="post" name="myform" id="signup_form">
    <div>
        <input type="text" name="fname" class="textinput" placeholder="Förnamn" maxlength="30" >
        <input type="text" name="lname" class="textinput" placeholder="Efternamn" maxlength="30" >
        <input type="text" name="email" class="textinput" placeholder="Emailadress" maxlength="50">
        <p class="font_form_text"><input type="text" name="lineage_nr" placeholder="Ättnummer" maxlength="10" class="sm_textinput" ></p>
        <p class="font_form_text mtop20">Jag vill ha utskick via brev:  <span class="fright padr10 valign_b"><label for="brev_ja">Ja </label><input type="radio" id="brev_ja" class="valign_m" name="brevutskick" value="Ja" checked="checked"><label for="brev_nej" class="padl5">Nej </label> <input type="radio"  id="brev_nej" name="brevutskick" value="Nej" ></span></p>
        <p class="font_form_text mtop20">Jag representerar mig själv: <span class="fright padr10 valign_b"> <label for="lineage_y">Ja </label><input type="radio" id="lineage_y" class="valign_m" name="own_lineage" value="Ja"><label for="lineage_n"class="padl5">Nej </label> <input type="radio" id="lineage_n" name="own_lineage" value="Nej"></span></p>

        <div id="hidden_lineage_form">
            <p class="font_form_text mtop20 padb7">Fullmakt behövs:</p>
            <input type="text" name="lineage_name" class="textinput" placeholder="Ättenamn" maxlength="40">
            <input type="text" name="pers_nr" placeholder="Personnummer" class="sm_textinput" maxlength="11">
        </div><br>
        <?php wp_nonce_field( 'signup', 'signup_nonce' ); ?>
            <input type="submit" class="submit mtop20 fright padr10" name="submit_msg" value="Skicka">

    </div>
</form>

最初加载页面时，文本输入字段具有这些值（看起来应该如此）：

.sm_textinput, .textinput {
height: 25px;
margin-bottom: 5px;
background: #fdfef5;
border: 1px solid #e7e5de;
font-family: 'PT Sans', sans-serif;
font-size: 14px;
padding: 5px 0 4px 8px;
display: block;

提交表单后，页面重新加载，然后css看起来像这样（相同）：

.sm_textinput, .textinput {
height: 25px;
margin-bottom: 5px;
background: #fdfef5;
border: 1px solid #e7e5de;
font-family: 'PT Sans', sans-serif;
font-size: 14px;
padding: 5px 0 4px 8px;
display: block;

}

..但正如我所说，文字输入字段的高度不同！当我在Photoshop中检查新高度时，它是23px。高度的原始值是25px加9px（顶部和底部填充）。

顺便说一下，我为这个页面使用了一个单独的css文件，我在“functions.php”中注册了该文件。我将它放在了styles.css：

的wp_register_style下面

wp_register_style('style_extra', get_template_directory_uri() . '/css/style_extra.css', array(), '1.1', 'all');
wp_enqueue_style('style_extra'); // Enqueue it!

这是一个奇怪的问题，我希望你能找到解决方案。

Answer 1

试试这个

assert expr1:expr2

表单提交后，输入字段看起来不同（Wordpress）

1 个答案: