不能用传说包围形式的HTML

Question

好吧，我知道字段集/图例在HTML中是如何运作的。 我不能用传说包围形式的HTML 我不知道为什么它不工作请帮助！ 为什么我的表格没有被我的传奇所包围

<form id="contact_form" action="#" method="post">
       <h5>Contact me</h5>
        <fieldset>
        <legend>Formularz kontaktowy</legend>
            <ul>
                <li>
                <label for="nom">Nom</label>
                <input id="nom" type="text" />
                </li>
                <li>
                <label for="prenom">Prenom</label>
                <input id="prenom" type="text" />
                </li>
                <li>
                <label for="mel">Email</label>
                <input id="mel" type="text" />
                </li>
                <li>
                <label for="telephone">Telephone</label>
                <input id="telephone" type="text" />
                </li>
                <li>
                <label for="mobile">Mobile</label>
                <input id="mobile" type="text" />
                </li>
            </ul>
            <p class="submit">
                <input type="button"  value="ok" alt="send form" id="btn-send" />
            </p>
        </fieldset>
    </form>

我的CSS：

/* --FORMULAIRE-- */
#content #c2 #contact_form{
    margin: 5em auto;
    width: 330px;
    background-color:#E03336;
    }
legend { 
    display: block;
    padding-left: 2px;
    padding-right: 2px;
    border: 3px #000000 solid;
    }
#content #c2 #contact_form h5 {
    display: none;  
    }
#content #c2 #contact_form fildset {
    overflow: hidden;   
    }
#content #c2 #contact_form ul {
    margin: 20px 0 0 0; 
    padding: 0;
    list-style: none;   
    }
#content #c2 #contact_form ul li {
    margin-bottom: 10px;
    }
#content #c2 #contact_form ul li label {
    float: left;
    padding: 8px 10px 0 0;  
    width: 90px;
    background-color:#36A643;
    color: #348096;
    font-size: 1.2em;
    font-weight: bold;
    text-align: right;
    }
#content #c2 #contact_form ul li input {
    border-style: ridge;    
    padding: 3px;
    width: 200px;
    font-size: 1.2em;
    }
#content #c2 #contact_form p.submit {
    text-align: center;

    }
#content #c2 #contact_form #btn-send{
    border-radius:10px;
    background-color: #348096;
    border-color: #348096;
    color: #fff;
    }
/* #content #c2 #form_contact {

    width:  300px;
    margin-left:118px;
    margin-top:  59px;

}

#content #c2 input {
    float:right;
    display:inline;
}
#content #c2 #form_contact label{
    font-size: 20px;
    width:50px;
    display: block;
    color:  #348096;
    clear:both;
    float:left;
}
#content #c2 #form_contact #btn_sub {
    width: 40px;    
    margin-top: 25px;
    margin-left: 25px;
    border-radius:10px;
    background-color:  #348096;
    border: #348096;
    }

* /

我做错了什么

Answer 1

因为它没有包含在图例中。你的html应该是这样的，如果你真的想用传奇标签包装它：

<form id="contact_form" action="#" method="post">
       <h5>Contact me</h5>
        <fieldset>
        <legend>Formularz kontaktowy
            <ul>
                <li>
                <label for="nom">Nom</label>
                <input id="nom" type="text" />
                </li>
                <li>
                <label for="prenom">Prenom</label>
                <input id="prenom" type="text" />
                </li>
                <li>
                <label for="mel">Email</label>
                <input id="mel" type="text" />
                </li>
                <li>
                <label for="telephone">Telephone</label>
                <input id="telephone" type="text" />
                </li>
                <li>
                <label for="mobile">Mobile</label>
                <input id="mobile" type="text" />
                </li>
            </ul>
            <p class="submit">
                <input type="button"  value="ok" alt="send form" id="btn-send" />
            </p>
        </legend>
        </fieldset>
    </form>

但这让我想知道你为什么要用传奇包裹它？你的代码是正确的。 html中的图例标记只是用于定义字段集的标题。

Answer 2

另外uapuap的答案：您可能想要做的是给出fieldset，或者给出css边界的公式。