Docs

[smenavto]

Hello,

A few questions for ya…

I was asked to convert a chart into a webpage. My work in progress can be seen here:
URL: http://sensiblemicro.com/page-testahhhhh/

Question #1

Since Cornerstone doesn’t allow for more than 6 “custom” columns, I took the image of the chart and spliced it into 6 even pieces and placed those images together in a marginless column.

It worked, however, when adjusting the screen resolution, some dimensions shift the bars out of line, while other dimensions & resolutions work perfectly.

So, are there any custom CSS snippets like, “!important” tags, etc that I could use to ensure that my images stick together without shifting? I’m also open to making mobile-versions of this page to ensure cross-platform consistency if we can get some resolutions to stick.

Question #2

Once I get the images to stop shifting upon re-size, I’ll likely have to disable the hover effect… I would only need those top “buttons” to hover, but seeing as these are a part of a solid image, I’m guessing I’ll have to remove all hover effects… Can you please help with this too?

Question #3

I’ve tried embedding the original chart’s PDF (seen here: http://sensiblemicro.com/touch-display-comparison-chart/), but I couldn’t get a full-page view to work.

So, with all of the above taken into consideration, do you have any recommendations for how I can best re-create this clickable chart into a good looking page?

Thank you in advance,
Mike

[Jade]

Hi Mike,

#1 Please try to add this code in the customizer:

.page-id-34186 .x-section .x-container.marginless-columns .x-column.x-1-6 {
    width: 16.66666% !important;
    float: left;
}

#2

.page-id-34186 .x-section .x-container.marginless-columns .x-column.x-1-6 a:hover,
.page-id-34186 .x-section .x-container.marginless-columns .x-column.x-1-6 a:hover > img {
    opacity: 1 !important;
}

#3 Unfortunately, charts are not yet supported in Cornerstone at the moment. But if you want to set a page to full width, edit the page and set No container – Header, Footer under page Template settings.

Hope this helps.

[smenavto]

Helped SO much! Thank you very much!!!

Where’s the “Buy Coffee” button?

[Thai]

You’re very welcome 🙂

If you need anything else please let us know.

[Author]

Posts