I'm trying to copy the CSS rule from this page from our product pages that buts a border around the main container and gives it its margin properties. See screenshot, highlighted with arrows [url=https://postimg.org/image/ptkjsyjgv/]
This is my new product page for the mobiles section of the website - you will see the border is missing. https://www.digitalsave.co.uk/apple-iphone-7-32gb.html
Thanks - struggling a bit with this one
This is one of the original product pages with border http://www.digitalsave.co.uk/apple-earpods.html
Please try
.et-content {
box-shadow: none !important;
}
No that didn't work - I had tried that. Thanks though.
.tygh-top-panel {
border-bottom: 2px solid #15a4de;
}
.tygh-header {
border-bottom: 1px solid #15a4de;
}
.ty-menu__items {
background: #15a4de !important;
}
.ty-search-magnifier {
background: #15a4de !important;
}
.subcategories a span {
color: #15a4de;
}
.top-menu-grid, .ty-menu__items {
background: #15a4de;
}
.et-social a {
background: #15a4de;
}
.subscribe-block .ty-btn-go {
background: #15a4de;
}
#scroll-up {
color: #15a4de;
}
::-webkit-scrollbar-thumb {
background-color: #15a4de;
}
.top-menu-grid .ty-menu__item-active .ty-menu__item-link {
background: #15a4de;
color: #efefef;
}
.et-content {
box-shadow: none !important;
}
It works for me
http://prntscr.com/g0drq2
May be I did not understand your question correctly? Please clarify
If you look closely at this screenshot you will see the arrows point to a thin grey border around the outside of the main container. This is what I want to replicate on my custom product page. I am not trying to remove it.https://www.digitalsave.co.uk/apple-iphone-7-32gb.html
Ok, it is required to add et-content class in this case to the row with product main content.
http://prntscr.com/g0izss
Since we cannot add extra classes to rows from the admin panel, please contact theme developers and ask them to make these changes
Ok so I see what I need to add thanks to your help - and have made the change and seen its effect using dev console. [url=https://postimg.org/image/n1l6k7mul/]
I am confident to do this myself - I just need to know what file to edit, or at least how to determine what file to edit. Do you know this?
Ok so I see what I need to add thanks to your help - and have made the change and seen its effect using dev console.
I am confident to do this myself - I just need to know what file to edit, or at least how to determine what file to edit. Do you know this?
Hello,
1. Go to Design > Layouts
2. Click products
3. Add the class 'et-content' to the span 16 grid that has the block 'Main Content' in itself.
4. Done
Best wishes,
I am confident to do this myself - I just need to know what file to edit, or at least how to determine what file to edit. Do you know this?
Unfortunately, no. You cannot control row classes from the back-end
Hello,
1. Go to Design > Layouts
2. Click products
3. Add the class 'et-content' to the span 16 grid that has the block 'Main Content' in itself.
4. Done
Best wishes,
Ha worked perfectly - simple! Thanks so much!
Hello,
1. Go to Design > Layouts
2. Click products
3. Add the class 'et-content' to the span 16 grid that has the block 'Main Content' in itself.
4. Done
Best wishes,
Ok so not perfectly haha but it has added margins and a border/shadow around the product display area.
https://www.digitalsave.co.uk/apple-iphone-7-32gb.html
@Poppedweb do you have any other ideas? I have happing editing .tpl files - just don't know which to edit. Do you know how I can work this out using dev tools on chrome/firefox?
I have happing editing .tpl files
That should say "i'am happy editing .tpl files" haha
Figured it out! Just had to re arrange my girds/blocks layout a bit and use 'span16 et-content' and the correct grid (not block) and it worked! :D
https://www.digitalsave.co.uk/apple-iphone-7-32gb.html
https://www.digitalsave.co.uk/apple-iphone-7-32gb.html
Nice to hear you figured it out by yourself, good job!
Yeah - thanks for pointing me in the right direction! :)