Mashup displays minimum size

[Bobiloco]

I've successfully set up the slideshow but when I look at the page the sheet displays at the absolute minimum size. I've tried changing various settings in the script but can't seem to change the size or shape. Are there other settings I should look at or is it something I can change in the app itself? Thanks!

Edit: We're using the November 2017 version of Qlik Sense.

[Lenka-ca]

I know it's an old issue but maybe it will help someone.

I had the same problem and I solved it when I added body and html height to ccs:

body { padding-bottom: 30px; height: 100%; } html { height: 100%; }

[ciphergod]

I know it's an old issue but maybe it will help someone.

I had the same problem and I solved it when I added body and html height to ccs:

body { padding-bottom: 30px; height: 100%; } html { height: 100%; }

Hi,

Tried this but didnt work, any details on how you actually got it to work?

[Lenka-ca]

I know it's an old issue but maybe it will help someone. I had the same problem and I solved it when I added body and html height to ccs: body { padding-bottom: 30px; height: 100%; } html { height: 100%; }

Hi,

Tried this but didnt work, any details on how you actually got it to work?

hi, I added the body and html to the css file in the form like I copied here, it changed the size after that. Maybe the height 100% is important? this is my complete css file if you want to compare

body { padding-bottom: 30px; height: 100%; }

html { height: 100%; }

div.qvobject, div.qvplaceholder { padding: 30px 10px 10px 10px; height: 400px; }

main {

width: 100%; padding: 0; }

.navbar { margin-bottom: 0 !important; }

.nav { color: white; }

.navbar-brand{ max-width: 345px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /*

Overrides Bootstrap navbar z-index to avoid conflict with selections bar */ .navbar-fixed-top { position: relative; z-index: 100; } .full { width: 100%; height: 100%; }

.width { width: 80%; }

.borderShadow { margin: 15px 0; background-color: #FFFFFF; -webkit-box-shadow: 0 0 16px -5px rgba(50, 50, 50, 0.52); -moz-box-shadow: 0 0 16px -5px rgba(50, 50, 50, 0.52); box-shadow: 0 0 16px -5px rgba(50, 50, 50, 0.52); }

carousel-example-generic {

width: 100%; }

.content-section-a { margin-bottom: 30px; padding-bottom: 30px; }

.content-section-b { padding-top: 70px; width: 100%; margin-bottom: 30px; padding-bottom: 30px; z-index: 1; position: relative; bottom: 60px;

}

.content-section-b:before { content: ''; position: absolute; top: 0; left: 0; height: 100%; width: 50%; background: #F5F5F5; -webkit-transform: skew(0deg, 6deg); -moz-transform: skew(0deg, 6deg); -ms-transform: skew(0deg, 6deg); -o-transform: skew(0deg, 6deg); transform: skew(0deg, 6deg); }

.content-section-b:after { content: ''; position: absolute; top: 0;

right: 0; height: 100%; width: 50%; background: #F5F5F5; -webkit-transform: skew(0deg, -6deg); -moz-transform: skew(0deg, -6deg); -ms-transform: skew(0deg, -6deg); -o-transform: skew(0deg, -6deg); transform: skew(0deg, -6deg); z-index: -1; }

.qcmd { cursor: pointer; }

parallax {

width: 100%; height: 300px; position: relative; top: 0; background: url(dark.jpg) no-repeat center center; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; }

popup {

background-color: #7f8c8d; color: #FFFFFF; position: fixed; padding: 10px; margin: 10px; bottom: 0; right: 0; display: none; border-radius: 5px; z-index: 6; }

footer {

background-color: #3F4944; text-align: center; color: #FFFFFF; padding-top: 30px; padding-bottom: 30px; margin-bottom: -30px; }