Schwimmer: links; vs display: inline; vs display: Inline-Block; vs display: Tabellenzelle;

Meine Fragen)

Wird eine dieser Methoden von einem professionellen Webdesigner bevorzugt?

Wird eine dieser Methoden von einem Webbrowser beim Zeichnen der Website bevorzugt?

Ist das alles nur eine persönliche Präferenz?

Gibt es andere Techniken, die mir fehlen?

Hinweis: Die obigen Fragen beziehen sich auf das Entwerfen eines mehrspaltigen Layouts

Schwimmer: links;

http://jsfiddle.net/CDe6a/

Dies ist die Methode, die ich beim Erstellen von Spaltenlayouts immer verwende, und sie scheint gut zu funktionieren. Der Elternteil kollabiert jedoch auf sich selbst, sodass Sie sich nur noch daran erinnern müssenclear:both; danach. Ein weiterercon Ich habe gerade festgestellt, dass der Text nicht vertikal ausgerichtet werden kann.

Anzeige: Inline;

Dies scheint das Problem des zusammenbrechenden übergeordneten Elements zu beheben, fügt jedoch Leerzeichen hinzu.

http://jsfiddle.net/CDe6a/1/

Das Entfernen von Whitespace aus HTML scheint die einfachste Lösung für dieses Problem zu sein, ist jedoch nicht erwünscht, wenn Sie wirklich wählerisch in Bezug auf HTML sind.

http://jsfiddle.net/CDe6a/2/

Anzeige: Inline-Block;

Scheint sich genau so zu verhaltendisplay:inline;.

http://jsfiddle.net/CDe6a/3/

Anzeige: Tabellenzelle;

http://jsfiddle.net/CDe6a/4/

Funktioniert perfekt.

Meine Gedanken:

Ich bin sicher, ich vermisse eine Menge Dinge, wie bestimmte Ausnahmen, die das Layout brechen, aberdisplay:table-cell; scheint am besten zu funktionieren, und ich denke, ich werde anfangen zu ersetzenfloat:left; da scheine ich immer durcheinander zu bringenclear:both;. Ich habe viele Artikel und Blogs darüber im Internet gelesen, aber keiner von ihnen gibt mir eine eindeutige Antwort darauf, was ich beim Layout meiner Website verwenden sollte.

Antworten auf die Frage(6)

Ihre Antwort auf die Frage