Unterschiedlicher abstand zwischen mehreren divs

[RooK]

Hallo Gemeinde,
Da mein Anliegen etwas spezielles ist hat die Suche im Forum nichts gebracht oder ich wusste nicht genau unter welchen Begriffen ich suchen sollte.

Es geht darum dass die Produkte in unserem Shop als Boxen angezeigt werden, die automatisch angelegt werden. Es sind immer drei Boxen nebeneinander, die weiteren Boxen werden darunter angereiht, auch hier drei nebeneinander usw. Nun ist es so dass ich einen Content habe der 740 Pixel breit ist in den die Boxen angezeigt werden. Ich hätte gerne dass die zwei Boxen aussen an den Rändern des Contents platziert sind, jeweils links und rechts und die Box in der mitte den gleichen abstand nach links und rechts hat. Ich habe den Boxen zwar immer einen "margin" zugewiesen aber das funktioniert logischer weise nicht, da ja dann, je nachdem auf welcher Seite ich den Abstand bestimme (zB. margin-left:5px) dieser dann nicht am Rand ist. Ich kann immer nur einer Box Attribute zuweisen die dann für alle gilt.

Ich hoffe, dass ich mein anliegen darstellen konnte.

Screenshot:

Danke schonmal für die Hilfe

EDIT: Ich sehe gerade dass es wahrscheinlich nicht in den HTML Bereich fällt. Wenn dem so ist bitte ich die Moderatoren diesen zu verschieben. Sorry für die unannehmlichkeiten :)

 

[Cheffchen]

Hallo,

das geht nur wenn mindest eins der blöcke eine eigene classe bekommt, so das man die ansprechen kann das zb nur das in der mitte left/right hat oder alle rechts und das 3 nichts oder oder.

Ohne Link schwer zu sagen was vielleicht schon hast oder ob mehr machen musst.

Cheffchen

 

[Skeeve]

beim generieren der boxen kannst du doch auch classen mitgeben .. left-box, middle-box und right-box o.ä.

 

[Banana_Jones]

Wenn man nun gar keinen Einfluss auf dem Mark-Up hat, kann man (je nach Aufbau des Codes) auch mit den nth-child CSS-Selektoren arbeiten. So könnte man das erste, zweite & dritte Element jeder Reihe getrennt ansprechen.

 

[RooK]

Danke für eure Antworten und Vorschläge und tut mir leid dass ich erst jetzt schreibe, ich war die Tage nicht im Büro... Ich lade direkt mal ein Screenshot hoch damit das besser zu sehen ist. Wie bereits erwähnt habe ich keinen Einfluss auf die einzelnen Boxen bzw. kann ich nicht sagen "die Rechte Box soll diese Attribute haben, die linke diese und die mittlere diese". Zumindest auf anhieb nicht.

Das ist die CSS die den Content und die Produktbox ansprechen:

.content_highlights{
width: 750px;
margin:5px 0px 20px 0px;
color:#e14e12;}

.produkt{
height: 260px;
width: 236px;
margin: 5px 0px 10px 10px;
border: solid 1px #c2c2c2;
float: left;
font-family:Arial; background:#fff;
-moz-box-shadow: 1px 1px 1px #999;
-webkit-box-shadow: 1px 1px 2px #999;
box-shadow: 0px 1px 1px #999;}

Und hier der Screenshot dazu:


Wie zu sehen ist besteht immer ein abstand zu einer Seite.

Link würde ich gerne mit schicken aber da ich nicht auf der aktiven Seite arbeite sondern mit einer Kopie der Seite die nicht über eine direkte URL aufrufbar ist wird das schwierig, sorry. Momentan sieht die Seite noch so aus: http://www.trendcenter.de vielleicht könnt ihr ja aus dem vorhandenen schlau werden. :grin:

 

[RooK]

Wenn man nun gar keinen Einfluss auf dem Mark-Up hat, kann man (je nach Aufbau des Codes) auch mit den nth-child CSS-Selektoren arbeiten. So könnte man das erste, zweite & dritte Element jeder Reihe getrennt ansprechen.

Das klingt Interessant Banana_Jones. Wie verhalten sich die "nth-child" Selektoren? Könntest du das an einem Beispiel klar machen?

Vielleicht sei noch eins zum besseren Verständnis gesagt: Ich habe den Content und die Produktbox. So, nun vergebe ich der Box Attribute. Im Backend gibt stelle ich nur noch ein wieviele Boxen in diesem Content pro Reihe angezeigt werden (zB. 3 pro Reihe) sollen und wieviel überhaupt auf der Seite (zB. 9 pro Seite). Diese Einstellungen werden nicht im Code sondern in den Einstellungen des Backends gemacht. Da es ja ein Shop-System ist.

 

[Cheffchen]

Hallo,

hast mal onkel G gefragt z.B.: CSS/Selektoren/Pseudoklasse/strukturelle Pseudoklasse/nth-child

Cheffchen

 

[RooK]

Hast recht Cheffchen, hätte zuerst den Onkel fragen sollen... Danke für den Hinweis :grin: