Schaltfläche wird nicht vollständig angezeigt

Question

Ich versuche, eine button in einigen HTML-Code für eine kleine Web-App, die ich gemacht habe, aber meine button sollte sagen, "ok", aber die button selbst ist zu klein und zeigt nicht die "ok " vollständig.

Fehle ich etwas für die span?

Wie kann ich die Größe des button erhöhen, um ein bisschen größer zu sein und alle "ok" anzuzeigen?

<center> 
 
    <br> 
 
    <br> 
 
    <span id="accept_button" style="display:none;"><button onclick="task.accept_choice();"><h3>ok</h3></button></span> 
 
    <span id="next_button" style="display:none;"><button onclick="task.next_trial();"><h3>ok</h3></button></span> 
 
</center>

Answer 1

das Problem ist, weil Sie span verwenden, die ein Inline-Element ist, so dass Sie display:block gesetzt hatte, aber ich rate Ihnen:

• Verwendung div einzuwickeln die button

• Sie brauchen nichts als Kind von button zu w rap den Text, da Sie Stil kann die button

• nicht verwenden center Tag, weil es bereits veraltet ist, sondern ein Element Stil mit CSS

<div id="accept_button"> 
 
    <button onclick="task.accept_choice();">ok</button> 
 
</div> 
 
<div id="next_button"> 
 
    <button onclick="task.next_trial();">ok</button> 
 
</div>

---

HINWEIS: In HTML5, können Sie span als Elternteil von h3 (gleiche gilt für button), aber nicht in HTML4

HTML5:

Zulässiger Mutterelemente

jedes Element haben, die Strömung enthalten kann Elemente, hgroup

7.1 Flow elements:

phrasing elements oder a oder p oder hr oder pre oder ul oder ol oder dl oder div oder h1 oder h2 oder h3 oder h4 oder h5 oder h6 oder hgroup oder Adresse oder oder ins oder del oder object oder map oder noscript oder section oder nav oder article oder aside oder header oder footer oder video oder audio oder figure oder table oder form oder fieldset oder menu oder canvas oder details

Und span/button sind einer der phrasing elements