Allgemeines » Produktansicht Malaga

30.12.2017 17:05

carnilab
#1

Hallo,

wie kann ich beim Malaga Design die Produkte als einzelne Boxen darstellen ?
Es soll also statt einem weißen Abstand zwischen den Produkten der Hintergrund zu sehen sein.
Hier auf meiner Seite zu sehen - da wo die beiden Trennstriche sind soll der Hintergrund zu sehen sein.
https://www.carnilab.com/minimoor/

vielen Dank

Antworten

Beitrag melden

#2

31.12.2017 17:32 (zuletzt bearbeitet: 31.12.2017 17:38)

TiJo
#2

Ti

TiJo

du kannst doch zwischen den Produkten einen leeren Container (Abstand) einfügen. Also Produkt, leeren Container, Produkt...

edit: wie ich sehe hast du das schon gemacht...

Antworten

Beitrag melden

#3

31.12.2017 17:59

TiJo
#3

Ti

TiJo

das Problem: die teiltransparente Hintergrundfarbe gehört zum Container (Div) Content-Bereich, in den alle anderen Container "eingefügt werden". Jeder Container hat also automatisch die Hintergrundfarbe vom Content-bereich, es sei denn, die Hintergrundfarbe von dem eigentlichen Container überdeckt den Content-Bereich an der Stelle.

Ich sehe für das Problem nur eine Lösung: Entferne die Hintergrundfarbe vom Content-Breich und füge sie jedem Unterelement seperat hinzu. Also jedem Shopprodukt, jeder Überschrift... einzeln.

Antworten

Beitrag melden

#4

02.01.2018 08:53

carnilab
#4

carnilab

Vielen Dank,
das wäre eine Option.
Wie kann ich die Hintergrundfarben im Conentbereich angeben ?
Über das Stylemenü kann man nur die Textfarbe ändern aber nicht die Hintergrundfarbe.

Antworten

Beitrag melden

#5

24.01.2018 12:17 (zuletzt bearbeitet: 24.01.2018 12:18)

az_
#5

az_

Für Dein Vorhaben musst Du zuerst die bg-color des Content transparent machen, dann erst nützt Dir eine tranpares Spacing (Abstand).

Probier mal:

1
2
3
4
5
 

.content-options, .j-spacing {
    background-color: transparent !important;
}
.j-module {background-color: white; padding: 15px !important; }
 

LG, az

Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).

Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!

...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de

Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html

Antworten

Beitrag melden

#6

02.02.2018 10:07

carnilab
#6

carnilab

Hallo,
vielen Dank
Das ist genau das was ich haben wollte.
Ich habe es nur auf der Produktseite angegeben.
https://www.carnilab.com/moos/freilandkultur/

Wenn du mir jetzt noch verrätst wie ich die Ecken abrunden kann wäre ich dir sehr dankbar.

Antworten

Beitrag melden

#7

02.02.2018 10:51

TiJo
#7

Ti

TiJo

zu sehen hier:
https://www.mediaevent.de/css/border-radius.html

Antworten

Beitrag melden

#8

02.02.2018 11:33

carnilab
#8

carnilab

Danke,
leider funktioniert es nicht.
So habe ich ihn angegeben.

1
2
3
4
5
6
7
8
9
10
 

<style type="text/css">
/*<![CDATA[*/
.content-options, .j-spacing {
    background-color: transparent !important;
}
.j-module {background-color: white; padding: 15px !important; }
/*]]>*/
div#main { border-radius: 18px  }
</style>
 

Antworten

Beitrag melden

#9

02.02.2018 11:55

TiJo
#9

Ti

TiJo

da ist aber ziemlich viel im Argen.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<style type="text/css">
/*<![CDATA[*/
.content-options, .j-spacing {
    background-color: transparent !important;
}
.j-module {background-color: white; padding: 15px !important; }
 
.j-product { border-top-left-radius: 18px;
border-top-right-radius: 18px;}
 

/*]]>*/
 
</style>
 

Antworten

Beitrag melden

#10

02.02.2018 12:05

carnilab
#10

carnilab

Jetzt funktioniert es danke
Allerdings ist jetzt das Logo nicht mehr transparent

Antworten

Beitrag melden

#11

02.02.2018 16:08

TiJo
#11

Ti

TiJo

welches Logo ist nicht mehr transparent?

Antworten

Beitrag melden

#12

20.02.2018 11:58

carnilab
#12

carnilab

Die Produktboxen haben jetzt schön abgerundete Ecken aber wie kann ich das bei den ganz normalen Textblöcken oder Überschriften machen ?
https://www.carnilab.com/moos/freilandkultur/
Den Footerbereich würde ich auch gerne in der Breite des Contents haben, bekomme es aber irgendwie nicht hin.
lg

Antworten

Beitrag melden

#13

22.02.2018 04:04 (zuletzt bearbeitet: 22.02.2018 04:07)

az_
#13

az_

...die musst Du Dir schon einzeln suchen.

1
 
#cc-matrix-2179970150 div {border-radius:15px;}

wird Dir nicht wirklich helfen. Und dann schau mal hier: https://css-tricks.com/almanac/properties/b/border-radius/

1
2
3
4
5
6
7
8
 

With just one value, border-radius will the same on all four corners of an element. 
But that need not be the case. You can specifiy each corner separatedly if you wish:
 
.round {
   border-radius: 5px 10px 15px 20px; /* top left, top right, bottom right, bottom left */
}
 
 

LG, az

Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).

Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!

...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de

Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html