Diamond Essential Grid - vertical overalpping

Support
#1

Hi, I have tweaked an Essential grid to be diamond-shaped and I need these to line up without margins, like a honeycomb effect similar to this site: http://bluevisual.tv/
The first row of 3 works fine, but in the subsequent rows the vertical alignment doesn;t quite work they are overalapping. This is the code that has made the modifications work so far,…there is something else needed to fix the vertical overlapping… thx so much.

in Theme Options > Global CSS

.esg-overflowtrick {
overflow: visible;
padding-top: 400px;

}

.myportfolio-container .esg-overflowtrick li:nth-child(3n+1) .esg-entry-media-wrapper{
left:50% !important;
top:-100% !important;

}

.myportfolio-container .esg-overflowtrick li:nth-child(3n+2) .esg-entry-media-wrapper{

margin-left: 25%;
margin-top: -25%;
}

.myportfolio-container .esg-overflowtrick li:nth-child(3n+3) .esg-entry-media-wrapper{
top:-100% !important;

}

#2

Hello @kirk74,

Thank you for the detailed information. Regretfully what you are trying to do needs custom coding and it is beyond the scope of our support already. We are unable to provide support for customizations under our Support Policy.

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third-party developer.

Perhaps, these links might help you instead:

Best Regards.

#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.