Gunnar Bittersmann: Inhalte gehen übern Rand

Beitrag lesen

@@pl

<form id="fileprops" onmousedown="dragStart(this);" style="cursor:move;display:none;width:60%;padding:0.5em;border-style:solid;background:silver;border-width:0.1em;position:fixed;top:50%;right:1em;">

Style-Angaben gehören ins Stylesheet, nicht ins HTML.

Eventhandler gehören ins JavaScript, nicht ins HTML.

    <fieldset><legend><strong>Datei: <code id="fileentity"></code> <a id="filedir">Verzeichnis</a>  </strong></legend>

Das strong-Element ist fehl am Platz; Styling (Fettschrift) per CSS.

Das a-Element ist fehl am Platz; die ID kannst du sicher dem fieldset-Element geben.

        <table class="grid" style="width:100%">
            <tr>
                <th style="text-align:left">Größe /bytes</th>
                <th style="text-align:left">Zuletzt geändert</th>
                <th style="text-align:left">Content-Type</th>

S.o.

        <fieldset><legend><strong>Dateiberechtigungen:</strong></legend>

S.o.

                    <td><input name="owner" value="4" type="checkbox" id="owner_read"> Lesen</td>
                    <td><input name="group" value="4" type="checkbox" id="group_read"> Lesen</td>
                    <td><input name="other" value="4" type="checkbox" id="other_read"> Lesen</td>
                </tr>
                <tr>
                    <td><input name="owner" value="2" type="checkbox" id="owner_write"> Schreiben</td>
                    <td><input name="group" value="2" type="checkbox" id="group_write"> Schreiben</td>
                    <td><input name="other" value="2" type="checkbox" id="other_write"> Schreiben</td>
                </tr>
                <tr>
                    <td><input name="owner" value="1" type="checkbox" id="owner_execute"> Ausführen</td>
                    <td><input name="group" value="1" type="checkbox" id="group_execute"> Ausführen</td>
                    <td><input name="other" value="1" type="checkbox" id="other_execute"> Ausführen</td>
                </tr>

Die Checkboxen haben allesamt keine Beschriftung. Sollten sie aber haben: label.

<td>
  <input name="owner" value="4" type="checkbox" id="owner_read">
  <label for="owner_read">Lesen</label>
</td>

etc.

                    <td colspan="3" style="text-align:center">

Es müffelt nach Layout-Tabelle.

LLAP 🖖

--
“I love to go to JS conferences to speak about how to avoid using JavaScript. Please learn CSS & HTML to reduce your JS code bloat.” —Estelle Weyl