Was ist die geringste Anzahl von Divs, mit denen das folgende Seitenlayout erstellt werden könnte?
-
24-10-2019 - |
Frage
aktualisieren
http://www.jsfiddle.net/dugrchamberlain/nmkxe/
Sehen Sie, wie alles auseinander fällt. Die Breite der ID = Mitte sollte das gesamte verbleibende Zentrum überspannen #left:width - #wrapper:width = #middle:width
Wenn #Right Inhalte enthält, dann enthält dann
(#left:width + #right:width) - #wrapper:width = #middle:width
Neueste Bearbeitung
Nur für die Informationen eines jeden. Das Bild unten wurde in MSPaint erstellt. Kein HTML verwendet überhaupt.
bearbeiten
Dies soll keine Trickfrage sein. Bitte betrachten Sie HTML4 nur als Option. Anscheinend habe ich das HTML4 -Tag verpasst. Überlegen Sie auch alle die Tatsache, dass der richtige Bereich im leeren Bereich zusammengebrochen werden sollte.
Ohne verschachtelte Divs für die tatsächlichen Merkmale, IE -Menüsinhaltsbereiche usw.
Meine Zählung ist 6 ???
Lösung
Wenn Sie Ihre Elemente nicht in eine divierte Breite einwickeln müssen, benötigen Sie nur 5 - ansonsten 6.
- Header
- links
- Mitte
- Rechts
- Fusszeile
- Wrapper (optional)
Ich hoffe nur, dass Sie nicht versuchen, ein paar Bytes zu sparen, indem Sie die Anzahl der Divs für das Layout minimieren :)
Andere Tipps
Bearbeiten: Sie können mit nur 4 Divs davonkommen, wenn Sie Header, links, Mitte und rechts verwenden, und einfach das erste Element in der Fußzeile auf klarstellen: links;
Der einfachste Weg, dies zu tun, besteht darin, so etwas zu tun
Körper p {klar: links; }
Wie in diesem Beispiel: http://jsfiddle.net/86m3m/1/
... und wenn Sie HTML5 verwenden: Keine Divs benötigt;)
<!DOCTYPE html>
<html>
<head>...</head>
<body>
<header>
...
<nav id="main"> ... </nav>
</header>
<nav id="left"> ... </nav>
<section id="main_content"> ... </section>
<section id="right_content"> ... </section>
<footer> ... </footer>
</body>
</html>