Just switched my theme to the boxed version and added a background. Like it a lot! Made it much easier to read on wider screens. I cant however figure out how to get the shadowy borders like on the recipes-demo (http://demo.tagdiv.com/newspaper_recipes/). Now my edges (towards the background color/picture) are razor sharp.
Is there a setting for this somewhere?
Hello MrOrsh,
You will have to use the following CSS and place it in Theme panel->Custom CSS area. The code is ->
.td-boxed-layout #td-outer-wrap {
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
-moz-box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
box-shadow: 0 0 61px 0 rgba(0,0,0,1.1);
}
The result you should see here -> http://screencast.com/t/iUyDbcJhENo
Thanks for your understanding!
Awesome support as usual 🙂
Now I just need to figure out how to get it to be just a little lighter, but guess changing the rgba-values does just that 🙂
Hello MrOrsh,
If you want to change the value of the RGBA, please notice that you should use an online RGBA generator, from here -> http://www.cssportal.com/css3-rgba-generator/# Also, if you want to use another color value, you simply replace the RGBA code with the color (red,blue) or hex value (#5e5e5e http://screencast.com/t/td4UvOIEtu1).
Thanks for your understanding!
Hope this old thread can be seen again now 🙂
Since of the last update, this does not work any longer. The edges are completely gone. The background color was lost as well during the update :-/
Can anything be done to fix it?
Site: enkelteknik.se
Hello MrOrsh,
Try the code below and place it in Theme panel->Custom CSS area.
The code is ->
.td-container-wrap {
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
-moz-box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
box-shadow: 0 0 61px 0 rgba(0,0,0,1.1);
}
The result is here -> https://www.screencast.com/t/3VhjKFO1Ynfr
Thanks for your understanding!
That works, sort of 🙂
Like you can see in the screenshot the top-menu gets the shadow-effect too.
The divider lines I can probably solve myself through some CSS, however the menu I don´t know how to keep as it is (just white).
Hello MrOrsh,
Use only the .td-main-content-wrap. Try the code below and place it in Theme panel->Custom CSS area.
The code is ->
.td-main-content-wrap {
-webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
-moz-box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
box-shadow: 0 0 61px 0 rgba(0,0,0,1.1);
}
Thanks.
Works perfect, except the footer and header does not get the effect :-/
Can I add any more content-wraps to include them as well?
Hello MrOrsh,
If you want to add more content wraps you should edit the HTML structure of your website and add many divs you want. If you are not aware of the steps, yo should consider hiring a freelancer/developer to help you because we cannot offer additional settings at the moment, sorry!
Thanks for the message!
That’s not really what I meant 🙂 More how to target the header and footer divs as well as the conent one.
Have been playing around with this and it seems with the new version of the theme there is no div surrounding the actual content (as the old td-boxed-version was doing). The new surrounding dog is instead always 100% of the browser width, making it useless for the shadow borders I want to achieve.
As far as I can see there is no way anymore to get the shadow edges on the boxed version of the theme, since there is no boxed div to assign them too.
Am I correct or am I missing something? Would be too bad if it wasn’t possible anymore since it made for a great design element having the “shadow borders” 🙁
Hello,
The code still works for the main content wrap but the header and footer have been changed to fit the new grid and the box shadow solution will not work on those containers properly. You will have to search for a different implementation. maybe with :before or :after pseudo-elements.
Thank you!
Ok, that’s too bad :-/ Really liked the boxed design with the side borders.
Is there any kind of css I could use to make the large container wrap keep the width of the page content? To use that div for the edges-effect. Or will that mess up the design completely?
Have emailed you about getting a copy of the previous version. Will just use that for now until I have time to try and implement the changes I want on the new design.
