Überlappen von Bild und Text

[Dome]

Hallo zusammen,
eigentlich wäre ich nun so weit, meinen Shop vorerst einmal so zu belassen, doch 2 Probleme bleiben noch.

1. Das Bild (A) läuft über den Rahmen
2. Der Preis (B) der ersten Zeile mit den Angeboten läuft in die zweite Zeile

Ich hab inzwischen wieder schon einiges versucht und gesucht, habe aber wieder eine Blockade und komme einfach nicht auf die Lösung.
Deshalb möchte ich freundlichst fragen, ob mir jemand verraten kann, wo ich da suchen müsste.

Mit freundlichen Grüssen
Dome

ueberlauf_01.gif (94.92 KiB) 6321-mal betrachtet

[Magnus]

Hallo,

versuch doch mal der umgebenden Box eine Höhe zuzuweisen:
In der contentlayout.css (Zeile 116) bei div.startArtikelBox eine Höhe angeben
Also so:

Code: Alles auswählen

div.startArtikelBox {
height:270px;
width:165px;
}

den genauen Wert musst halt noch ermitteln, im IE ansehen und im FF!

viele Grüße

Magnus

[Dome]

Hallo Magnus,
zuerst einmal Danke für die Antwort, welche zumindest einmal eine schnelle Lösung war, um das Ganze nicht mehr so sehr besch...eiden aussehen zu lassen. Doch wieder einmal hat es sich gezeigt, dass die richtige Frage manchmal schwerer zu finden ist, als die Antwort.
Denn meine Suche bezieht sich auf den Teil, an welchem die erste Zeile mit den Atikelrahmen (Bild, Name, Preis) gegenüber der nächst folgenden ausgerichtet wird, dass man da beispielsweise ganz einfach ein "<br/>" oder eine Grafik dazwischen klemmen könnte.

Und dann ist ja noch das seitliche Überlappen vom ersten Bild, bei welchem ich dieses Problem nicht mit einer grösseren Breite lösen kann. Weil dann ja keine 3 Rahmen mit den Bildern mehr da hinein passen würden. Was ich also diesbezüglich nicht begreiffe ist vor allem der Umstand, dass alle anderen Bilder ja beim Import übers Admin Menü in der Grösse angepasst werden. Weshalb also ist es bei dem ersten Bild von links nicht der Fall ???

Wäre schön, wenn mir einer, der auch schon mit diesem problem zu kämpfen hatte, diesbezüglich weiter helfen könnte.
Mit freundlichen Grüssen
Dome

[Martens]

das liegt am Bildformat. Die Bildgrößeneinstellung im Adminbereich bezieht sich nicht nur auf die Höhe, sondern auch auf die Breite. Wenn, wie in Deinem Fall, im Adminbereichl die Bildgröße von 160 auf 180 erhöht wird, bedeutet das, dass Bilder, die ein geringeres Breiten-/Höhenverhältnis als 1:1,125 haben, breiter als 160 Pixel werden. Quadratische Bilder werden dann auf 180x180, Querformate auf 180 Breite und entsprechend geringere Höhe skaliert.
Die Rahmen auf der Startseite sind nur 165px breit. Probier mal folgende Änderung in contentlayout.css aus:

Code: Alles auswählen

div.startArtikelBox div {
           display:                         block;
           float:                                 left;
           width:                                 165px;
           height:                         210px;
           margin:                       0px 10px 25px;
           border:                         1px solid #D7DBDD;
           text-decoration:         none;
           text-align:                        center;
}

div.startArtikelBox[class] div {
   width:                                 165px;
   min-height:                           250PX;
}

ändern in

Code: Alles auswählen

div.startArtikelBox div {
           display:                         block;
           float:                                 left;
           width:                                 165px;
           height:                         210px;
           margin:                       0px 3px 25px;
           border:                         1px solid #D7DBDD;
           text-decoration:         none;
           text-align:                        center;
}

div.startArtikelBox[class] div {
   width: 180px;
   min-height:                           250PX;
}

(Geändert: margin in „div.startArtikelBox div“ von „0px 10px 25px“ auf „0px 3px 25px“ und width in „div.startArtikelBox[class] div“ von „165px“ auf „180“)

Das ist dann zwar alles ziemlich gequetscht, aber müsste passen. Falls in einigen Browsern der Inhalt doch schon nach der zweiten Box umbricht, kannst Du versuchen in der Klasse „div.startArtikelBox div“ die margin von 3px noch zu verringern.

Viel Erfolg
Martin