![Check out Enfold](https://kriesi.at/wp-content/themes/kriesi/images/banner-enfold.jpg)
-
AuthorPosts
-
August 22, 2020 at 12:42 pm #1239960
How to change the margins und paddings .av-accordion-bg-multi toggle? I need The image close to the border.
Thisd dosent work:
.av-accordion-bg-multi .js_active .toggler {
padding: 0 0 0 0 !important;
}Thanks
August 22, 2020 at 12:49 pm #1239961it should look like below:
https://drive.google.com/file/d/1pT2cixzQ0geRKmgEt2uQszsBFHJ-wl8Q/view?usp=sharingCan you use the picture as a background?
-
This reply was modified 4 years ago by
rallegrafix.
August 23, 2020 at 3:31 pm #1240107Hi rallegrafix,
Can you make the mockup public? We cannot see the image.
Best regards,
VictoriaAugust 23, 2020 at 7:09 pm #1240191Done. it should look like the first toggle
https://drive.google.com/file/d/1pT2cixzQ0geRKmgEt2uQszsBFHJ-wl8Q/view?usp=sharing-
This reply was modified 4 years ago by
rallegrafix.
August 24, 2020 at 5:30 pm #1240435Hi rallegrafix,
Best regards,
VictoriaAugust 24, 2020 at 7:49 pm #1240479It should look like this picture. picture on the left and the writing in the middle. the writing should be vertical in the middle.
https://drive.google.com/file/d/1U5DAe5elejg5-bVnKzHGNwfepl1d6PsS/view?usp=sharingAugust 24, 2020 at 8:33 pm #1240511Hi rallegrafix,
https://share.getcloudapp.com/ApukEPnL The negative margin here is pulling the next toggle up and the line-height rule does not work in this case.
Best regards,
VictoriaAugust 25, 2020 at 5:12 pm #1240710I don´t know why, but it dosen´t work…
This is the code:
/*—————————————-
// CSS – Multicolor tabs
//————————————–*//* Tab 1 */
.av-accordion-bg-multi .av_toggle_section:nth-child(1) .toggler {
background: #ffb600;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(1) .toggle_content {
background: #fff8eb;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(1) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-1_weiß-auf-Farbe_40px.png);
padding-right: 5px;
}/* Tab 2 */
.av-accordion-bg-multi .av_toggle_section:nth-child(2) .toggler {
background: #ee7623;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(2) .toggle_content {
background: #fef2e9;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(2) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-2_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 3 */
.av-accordion-bg-multi .av_toggle_section:nth-child(3) .toggler {
background: #d50037;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(3) .toggle_content {
background: #fbecea;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(3) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-3_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 4 */
.av-accordion-bg-multi .av_toggle_section:nth-child(4) .toggler {
background: #e64783;
padding: 0 0 0 0 !important;
margin-bottom: -8px;}
.av-accordion-bg-multi .av_toggle_section:nth-child(4) .toggle_content {
background: #fdeff4;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(4) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-4_weiß-auf-Farbe_40px.png);
padding-right: 5px;
}/* Tab 5 */
.av-accordion-bg-multi .av_toggle_section:nth-child(5) .toggler {
background: #923a7f;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(5) .toggle_content {
background: #f3ecf4;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(5) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-5_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}
/* Tab 6 */
.av-accordion-bg-multi .av_toggle_section:nth-child(6) .toggler {
background: #0071ce;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(6) .toggle_content {
background: #ebeff9;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(6) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-6_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 7 */
.av-accordion-bg-multi .av_toggle_section:nth-child(7) .toggler {
background: #00a6ce;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}.av-accordion-bg-multi .av_toggle_section:nth-child(7) .toggle_content {
background: #edf7fb;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(7) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-7_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 8 */
.av-accordion-bg-multi .av_toggle_section:nth-child(8) .toggler {
background: #37b30e;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(8) .toggle_content {
background: #f2f7ed;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(8) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-8_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 9 */
.av-accordion-bg-multi .av_toggle_section:nth-child(9) .toggler {
background: #04963f;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(9) .toggle_content {
background: #ebf0ea;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(9) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-9_weiß-auf-Farbe_40px-1.png
);
padding-right: 5px;
}/* Tab 10 */
.av-accordion-bg-multi .av_toggle_section:nth-child(10) .toggler {
background: #5b6670;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(10) .toggle_content {
background: #f0f1f2;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(10) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-10_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab title color */
.av-accordion-bg-multi .toggler,
.av-accordion-bg-multi .toggler.activeTitle:hover {
color: #FFF;
border:none;
}/* Hide default icon */
.av-accordion-bg-multi .toggle_icon {
display: none;
}#top .av-accordion-bg-multi .toggler {
padding-left:20px;
/*height: 53px !important;*/
font-size: 18px;
font-weight: bolder;
}#top .av-accordion-bg-multi .activeTitle {
height: 44px !important;
}/* Individuelle Content-Linkfarbe */
.av-accordion-bg-multi .toggle_content a:link,
.av-accordion-bg-multi .toggle_content a:visited,
.av-accordion-bg-multi .toggle_content a:hover,
.av-accordion-bg-multi .toggle_content a:active {
color: #7b8082!important;
}
.av-accordion-bg-multi .toggle_content a:link strong,
.av-accordion-bg-multi .toggle_content a:visited strong,
.av-accordion-bg-multi .toggle_content a:hover strong,
.av-accordion-bg-multi .toggle_content a:active strong{
color: #7b8082!important;
}-
This reply was modified 4 years ago by
rallegrafix.
August 27, 2020 at 4:13 pm #1241247can you please look again and give me a tip.
best regards Ralph/*—————————————-
// CSS – Multicolor tabs
//————————————–*//* Tab 1 */
.av-accordion-bg-multi .av_toggle_section:nth-child(1) .toggler {
background: #ffb600;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(1) .toggle_content {
background: #fff8eb;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(1) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-1_weiß-auf-Farbe_40px.png);
padding-right: 5px;
}/* Tab 2 */
.av-accordion-bg-multi .av_toggle_section:nth-child(2) .toggler {
background: #ee7623;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(2) .toggle_content {
background: #fef2e9;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(2) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-2_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 3 */
.av-accordion-bg-multi .av_toggle_section:nth-child(3) .toggler {
background: #d50037;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(3) .toggle_content {
background: #fbecea;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(3) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-3_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 4 */
.av-accordion-bg-multi .av_toggle_section:nth-child(4) .toggler {
background: #e64783;
padding: 0 0 0 0 !important;
margin-bottom: -8px;}
.av-accordion-bg-multi .av_toggle_section:nth-child(4) .toggle_content {
background: #fdeff4;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(4) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-4_weiß-auf-Farbe_40px.png);
padding-right: 5px;
}/* Tab 5 */
.av-accordion-bg-multi .av_toggle_section:nth-child(5) .toggler {
background: #923a7f;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(5) .toggle_content {
background: #f3ecf4;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(5) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-5_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}
/* Tab 6 */
.av-accordion-bg-multi .av_toggle_section:nth-child(6) .toggler {
background: #0071ce;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(6) .toggle_content {
background: #ebeff9;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(6) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-6_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 7 */
.av-accordion-bg-multi .av_toggle_section:nth-child(7) .toggler {
background: #00a6ce;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}.av-accordion-bg-multi .av_toggle_section:nth-child(7) .toggle_content {
background: #edf7fb;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(7) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-7_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 8 */
.av-accordion-bg-multi .av_toggle_section:nth-child(8) .toggler {
background: #37b30e;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(8) .toggle_content {
background: #f2f7ed;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(8) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-8_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab 9 */
.av-accordion-bg-multi .av_toggle_section:nth-child(9) .toggler {
background: #04963f;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(9) .toggle_content {
background: #ebf0ea;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(9) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-9_weiß-auf-Farbe_40px-1.png
);
padding-right: 5px;
}/* Tab 10 */
.av-accordion-bg-multi .av_toggle_section:nth-child(10) .toggler {
background: #5b6670;
padding: 0 0 0 0 !important;
margin-bottom: -8px;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(10) .toggle_content {
background: #f0f1f2;
}
.av-accordion-bg-multi .av_toggle_section:nth-child(10) .toggler:before {
content: url(https://protom-education.com/wp-content/uploads/2020/08/Icon_Modul-10_weiß-auf-Farbe_40px.png
);
padding-right: 5px;
}/* Tab title color */
.av-accordion-bg-multi .toggler,
.av-accordion-bg-multi .toggler.activeTitle:hover {
color: #FFF;
border:none;
}/* Hide default icon */
.av-accordion-bg-multi .toggle_icon {
display: none;
}#top .av-accordion-bg-multi .toggler {
padding-left:20px;
/*height: 53px !important;*/
font-size: 18px;
font-weight: bolder;
}#top .av-accordion-bg-multi .activeTitle {
height: 44px !important;
}/* Individuelle Content-Linkfarbe */
.av-accordion-bg-multi .toggle_content a:link,
.av-accordion-bg-multi .toggle_content a:visited,
.av-accordion-bg-multi .toggle_content a:hover,
.av-accordion-bg-multi .toggle_content a:active {
color: #7b8082!important;
}
.av-accordion-bg-multi .toggle_content a:link strong,
.av-accordion-bg-multi .toggle_content a:visited strong,
.av-accordion-bg-multi .toggle_content a:hover strong,
.av-accordion-bg-multi .toggle_content a:active strong{
color: #7b8082!important;
}August 30, 2020 at 12:42 pm #1241904Hi rallegrafix,
https://share.getcloudapp.com/NQur4dn7 Please remove this line and see if the issue gets resolved.
Best regards,
VictoriaAugust 31, 2020 at 7:59 am #1242062Hello Victoria, thank you very much for your efforts. I’ve tried this but it doesn’t work. I do not understand why and what it could be. Isn’t there a way to put the text higher up?
Best regards
RalphSeptember 3, 2020 at 1:39 pm #1243087Hi,
This css code should remove the padding around the toggle graphic and vertically align the title.
.toggler { max-height: 44px !important; height: 44px !important; } .toggler::before { float: left; } .av-accordion-bg-multi .av_toggle_section .toggler { padding: 0 !important; }
Best regards,
Ismael -
This reply was modified 4 years ago by
-
AuthorPosts
- You must be logged in to reply to this topic.