Ich versuche, den Rand zwischen der Suchleiste und dem "Go!" Knopf oben auf dieser Seite: Ссылка
Ich habe versucht, alle Stile zu entfernen und margin:0;padding:0;border:none;
hinzuzufügen, aber es gibt immer noch einen Abstand zwischen den beiden Elementen. Ich kann dieses Problem nicht auf JSFiddle replizieren, aber es tritt in allen Browsern meiner Website auf.
So funktionieren Elemente als inline-block
.
Wenn Sie inline-block
-Elemente verwenden, verwenden Sie diese häufig innerhalb eines Absatzes, so dass der Abstand zwischen den Buchstaben konsistent sein muss. inline-block
-Elemente gelten auch für diese Regel.
Wenn Sie den Speicherplatz vollständig entfernen möchten, können Sie die Elemente floaten.
%Vor%Sie können den Leerraum auch aus Ihrem Vorlagendokument entfernen. Wie so:
%Vor% Der angezeigte Bereich ist der Standardabstand, der auf Inline-Elemente angewendet wird. Einfachster Hack? Setzen Sie font-size: 0
auf form
und setzen Sie dann die tatsächliche Schriftgröße auf der Eingabe- und Schaltfläche zurück.
Magie.
%Vor% Warum passiert das? Der Browser interpretiert den Leerraum zwischen input
s als Textbereich und rendert ihn entsprechend. Sie können auch alle Ihre Elemente in einer Zeile zusammenfassen, aber das ist eine hässliche Codesuppe.
Dieser Leerraum ist relativ zu Ihrer Schriftgröße. Sie können es entfernen, indem Sie font-size:0
für den Container Ihrer Eingaben hinzufügen, in diesem Fall ein Formular wie folgt:
Wenn ich chrome auf dem Mac verwende, kann ich den Platz loswerden, wenn ich den Formularknoten in den Developer-Tools als HTML bearbeite und den Abstand zwischen den beiden schließenden Tags entferne:
%Vor%wird zu:
%Vor%Eine Möglichkeit ist das Entfernen von Speicherplatz. Wenn Sie jedoch keine unlesbare Ein-Zeilen-Unordnung haben möchten, können Sie den HTML-Kommentar verwenden:
%Vor%