image border in blocks and modules

Posted in: Newspaper
Post count: 11
vdifortuna
#17016
Jul 30, 2014 at 8:04 pm

Hi!
I want to know how to set up a image border for the differents blocks and modules?
for example a border for the slider and the post, or in the homepage for the blocks and modules

https://www.dropbox.com/s/gmh0efnvkefivos/shadow-border.PNG

https://www.dropbox.com/s/qg6ebt99mrz3xh7/shadow-border-example.PNG

like the image border you set up under the main menu in the theme

thanks!

Post count: 6600
Lucian
#17057
Jul 31, 2014 at 9:44 am

Hi,

That border it’s made via css by adding content after the menu using the :after selector like this: http://screencast.com/t/re2f76Kx6N

This is the css code:

.td-full-layout .td-menu-background:after, .td-boxed-layout .td-menu-wrap:after {
position: absolute;
bottom: -16px;
left: 0px;
display: block;
content: '';
height: 12px;
width: 100%;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
background: transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMBAMAAABRpcpkAAAAJFBM…AIElEQVR4XmNgYBBgUGAwYHBgCGBIYChgaGCYwLCAYQMAH7gEIQV1/xQAAAAASUVORK5CYII=') repeat-x;
pointer-events: none;
}

You have to select every block you want and add this using the :after selector.

What you want is not an easy task and needs custom work, you could do it yourself or hire a freelancer to do it for you.

Thnaks

Viewing 2 posts - 1 through 2 (of 2 total)
The forum ‘Newspaper’ is closed to new topics and replies.