Angaben zu Maßen (z.B. Linkbox)

jjonline

Hallo,

kürzlich benötigte ich eine Info dazu, wie man etwas in Sachen "Linkbox" einstellt. Hierbei ging es darum, für sämtliche Linkboxen dieselbe Größe einzustellen, da diese sonst je nach Textmenge variiert. Die Lösung war, die Höhe entprechend bei allen Linkboxen gleich einzustellen und fand sich hier: Höhe der Linkboxen festlegen.

Nun ist es zunächst aber erst einmal nicht ersichtlich, wie hoch denn die jeweiligen Linkboxen sind, die man verwendet hat.

Es würde helfen, wenn im ZP die eigentlichen Maße angezeigt würden.

Mario

Die Höhe der Linkbox richtet sich immer nach dem Inhalt. Eine Mindesthöhe greift erst wenn diese im Widget vergeben wird.

Heißt ja auch Mindesthöhe und nicht Höhe.

Die Mindesthöhe ist also "Null" wenn du keine vergibst.

jjonline

Mario Ja, das ist natürlich zutreffend. Vielleicht habe ich mich auch falsch ausgedrückt, worauf ich hinaus wollte. Ich schrieb jedoch "Höhe".

Man erstellt bspw. mehrere Linkboxen mit unterschiedlichen (Text)inhalten. Die Linkboxen sind deshalb (wie von dir auch richtig beschrieben) unterschiedlich hoch.

Nun war die Empfehlung (siehe Link im vorherigen Beitrag), eine gleiche Höhe für alle Linkboxen festzulegen. Hier richtet man sich dann ja nach der Linkbox, die wegen des Inhalts die größte Höhe aufweist.

Eben diese Höhe (in Pixel) ist aber im ZP ja nicht erkennbar. Daher muss man also nach und nach Zahlenwerte (Pixel) für die Höhe der Linklbox ausprobieren, bis man einen vernünftigen Wert "ermittelt" hat.

Mario

Wie gesagt es gibt keine Höhenangabe, diese ergibt sich aus dem Inhalt plus den Padding-Werten. Deshalb kann weder ZP noch irgend ein Tool eine Höhe ausspucken. Ich mache in solchen Fällen immer einen Screenshot und messe dann in einem Grafikprogramm.

Stefan S

Hallo,

jedem Nutzer die aktuellen Maße der Elemente anzuzeigen scheint mir nicht sehr sinnvoll, das will doch kaum einer wissen und da würde es nur stören. Wer es wissen muss, der sollte sich mal mit den in den Browsern integrierten Entwickler-Tools beschäftigen, damit ist so etwas in nullkommanix herausfindbar und diese Tools sind genau dafür gemacht.

jjonline

Stefan S Hallo, ich hatte mich bereits daran versucht, mit den genannten Entwickler-Tools (Chrome Browser und Firefox) gezielt heraus zu finden, welche Maße die Linkbox mit der größten Höhe hat, war aber nicht erfolgreich.

Im Chrome Browser wird das Fenster je geteilt. Links sieht man den jeweiligen Teil der maßgeblichen Website, rechts erscheint der Bereich des Entwickler-Tools.

Im linken Bereich der Website-Anzeige habe ich mit der Maus eine der Linkboxen angewählt und die rechte Maus-Taste gedrückt. Im erscheinenden Kontextmenü anschließend "Untersuchen" gewählt. Im Bereich des Entwickler-Tools habe ich nun nach Inhalten gesucht, die sich auf Maße beziehen.

Mir ist aber nicht klar, wie ich nun schnell die Linkbox mit der größten Höhe finden kann, um die entsprechenden Einstellungen im ZP vornehmen zu können ohne mit geschätzten Zahlenwerten zu experimentieren, die ich dann nach und nach erhöhe.

Die Angaben die in dieser Grafik angezeigt werden (siehe Screenshot), scheinen es nicht zu sein, denn sie variieren ja auch, sobald man Einstellungen am geteilten Browserfenster vornimmt und zeigen wohl nur die Maße an, die sich eben auf die Größe des Elements (Linkbox) in Abhängigkeit des sichtbaren Browserfensters ist beziehen.

Im derzeitigen Kundenprojekt werden übrigens 26 Linkboxen verwendet.

Hanabi

Hallo Jörg,

setze einfach bei den Linkboxen jeweils den Rahmen auf "rot", dann kannst Du bei nebeneinander liegenden Boxen relativ schnell die Mindesthöhe austesten. Das Ganze macht aber nur dann Sinn, wenn die Linkboxen auch gleich breit sind, ansonsten würden die sich durch den Umbruch bei responsiver Darstellung unterschiedlich stark ausdehnen.

jjonline

Hallo Hanabi,

danke, es sind jeweils drei Linkboxen in einer Reihe (bis auf die letzte Reihe), die allesamt dieselbe Breite aufweisen.

Auch mit rotem Rahmen lässt sich jedoch nicht ermitteln, welche Linkbox in sämtlichen Reihen die größte Höhe aufweist, um diesen Wert dann für alle Linkboxen einzutragen.

Man kann auf einen Blick in diesem Fall auch jeweils nur die Linkbox-Höhen einer Reihe vergleichen, da man ja herunter scrollen muss, um die nächsten Linkboxen zu sehen und dadurch hat man die nächste Reihe nicht mehr im Blick.

Es bleibt dann also nur die Varianten, die Stefan S und Mario mir freundlicherweise vorschlugen.

Erstgenannte (Entwickler-Tool des Browsers) habe ich wohl nicht nachvollziehen können, die zweite Möglichkeit Bedarf auch eines Zeitaufwandes.

Alternativ könnte ich eine Software nutzen, die ein "Lineal" auf dem Bildschirm abbildet ("Pixelruler" etc.), was den Aufwand jedoch auch nicht mindert.

Und darum ging es mir ja letztendlich.

jjonline

Mario Vielen Dank! Ich werde das wohl auch so handhaben müssen.

Stefan S

Gibt es denn einen Link zur Seite mit den vielen Linkboxen?

jjonline

Stefan S Hallo, kann ich den Weblink via Mail senden? Möchte das Projekt nicht ohne Rücksprache mit dem Kunden in einem Forum veröffentlichen.

Stefan S

Dann bitte per Mail, inkl. Link zu diesem Beitrag als Referenz an: support[ät]zeta-producer.com ([ät] durch @ ersetzen)

jjonline

Vielen Dank, Stefan!

Mail ist unterwegs.

Stefan S

OK,

etwas JavaScript/jQuery in der Entwicklerkonsole hilft ungemein:

Öffnen Sie die Website in Chrome
Öffnen Sie die Entwickler-Konsole mit STRG-SHIFT-J (damit wird gleich der richtige Tab geöffnet)
Kopieren Sie den Nachfolgenden Code in die Zwischenablage und fügen Sie ihn dann in der Konsole ein
Drücken Sie die Return-Taste
Staunen Sie

JavaScript

$z('div.zpwLinkbox').each(function(){
    var aid = $z(this).attr("data-article-id");
    var height = $z(this).height();
    console.log("Linkbox für ArtikelID: " + aid + " hat die Höhe: " + height);
})

jjonline

Stefan S Ich staune wirklich!

Darauf wäre ich nie gekommen, nochmals herzlichen Dank!

Super Support!

Angaben zu Maßen (z.B. Linkbox)

Jetzt mitmachen!

Hilfe zum Support-Forum

Wollen Sie eine professionelle Website erstellen?