castlecode

castlecode supports this item

Supported

This author's response time can be up to 1 business day.

262 comments found.

I am trying to use the ratio parameter and it is giving me odd heights which is causing undesirable behavior with my tiles. Every other row only has one tile compared to the odd rows which have three (as intended). Here is the page that I am having trouble with:

http://www.nd.com/product/use-cases-tiles/

I am also having problems with the responsiveness scaling too small. I set a min-width on the div’s within the [flippingCard] shortcode, but it is ignoring that minimum. Can I apply minimums directly to the [flippingCard] shortcode?

Any help is greatly appreciated.

Hi,
Try adding this line of CSS:

body{
    overflow-y: scroll !important; 
}
Best ;)

I’m not sure what that would have to do with the height of the first tile, but I added it and no change. The first tile at 1280×800 still is sized at 390.719px whereas the other two tiles in the row are sized at 385.109px. You can see a screen capture of what it looks like here:

http://www.nd.com/wp-content/uploads/2017/09/Capture.png

Again, this is if you resize your browser to 1280×800 (I use Chrome plugin Window Resizer) and then refresh the browser it renders the heights incorrectly.

Thanks!

Hi,
the issue is that when the page first loads there’s no scroll-bar so the width is different for the first card, but later on we add height to the flipping card (with JS because of the ratio) so the scroll-bar shows up, so now the 33% with scroll-bar is different than 33% without scroll-bar

it is kind of confusing, but with that line of CSS the scroll-bar is present from the beginning.
I tested out with the resolution you mentioned, and I see it exactly as the screen shot you sent, but after adding that peace of CSS above then the first card has the exact same height as the others

did you add that line of CSS in this page? http://www.nd.com/product/use-cases/ since I don’t see it in the source code, you can add it at the top of the the css/flipCard.css file

Best, David

roslindale

roslindale Purchased

Hi,

In some screen views, the FlipCards overlap the static navigation bar. Here’s the web page: http://kurecreative.com/services/

Thanks,

Jon Cullen

Hi Jon,
Try adding this peace of CSS:

div.fc_card-container {
    z-index: 99 !important;
}
you can add it at the beginning of the css/flipCard.css file

Best, David
by
by
by
by
by
by