Hi, I’m trying to achieve a similar look with nytimes.com for my site.
I managed to get rid of the shadows under the menu and borders around the main, but when I resize the window wider, a grey border appears around the main. How can I fix this and add a line on the top and bottom of the main menu?
site : jnilbo.com
screenshot : https://pasteboard.co/IcadN9b.png
Hi,
That is coming from the demo stylesheet, the magazine demo that is installed. Without that customization it would be like this – http://prntscr.com/nipek7
One way of removing this design, is with CSS – http://prntscr.com/nipfbo
Enter this code in Theme panel->Custom code->Custom CSS
.td-magazine.td-boxed-layout .td-container-wrap {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
Let me know if you need more help, or you have further questions.
Thanks
Hi Simon,
Thanks a lot for your help. It works perfectly!
Do you mind writing me another code for 1px stroke over and under the main menu as well?
Many thanks in advance!
Hi,
I could do that, depends how exactly you want it to be. Something like this maybe?
– http://prntscr.com/njgev6
.td-magazine.td-boxed-layout .td-header-menu-wrap-full.td-container-wrap {
border-bottom: 1px solid black;
}
I can modify it if needed, let me know.
Thanks
Thanks again for your help.
I was able to use the code and create a borderline around the menu.
Is it also possible to make the lines slightly shorter?
Like 10px margin left and right. Right now it goes all the way to the end of the browser.
https://pasteboard.co/IdHmpG9.png
Also, I’m getting an white margin on the bottom of the footer and I’d like to remove it as well.
https://pasteboard.co/IdHnt4Z.png
Many thanks in advance!
From what I know a border length can’t be set with CSS, you could do this in a different way. Like this maybe – http://prntscr.com/nly5dk
So you could remove the previous code and use this one instead
– https://pastebin.com/MyA4GnRq
For the footer it is quite unusual that a padding is set there. Seems to happen only in the homepage. However you can use this code to remove it
.td-main-content-wrap {
padding-bottom: 0;
}
This is perfect!
Thanks for your help again.
Everything works great, and it looks exactly like how I wanted.
Thanks a lot!