about picture fitting

Eric05

Hello Apollo 13,

It looks like album's pictures are always covered by the menu and the footer, doesn't matter wich fit option is used. Am I wrong? There is no fit option like the hypershot's one, where the whole picture is displayed between top menu and footer?

OK, just found the answer :
http://support.apollo13.eu/discussion/comment/2256#Comment_2256

Hope you'll give us same option as Hypershot fit small images one!

Air

Hello:-)

Eric05 said: Am I wrong?

You are right:-)

Eric05 said: Hope you'll give us same option as Hypershot fit small images one!

I don't promise, even hypershot received this in later times, and it was not easy:-)

With regards.

Eric05

OK, hope you'll make it because when the css is modified, the pictures are no longer well displayed on mobile!

Air

You can always reset this CSS with media queries for smaller size screens:-) If you need help with it then please tell me:-)

With regards.

Eric05

Yes, I need your help! Thank you!

Air

OK so please post in topic you linked before, and write there what version of code you used(cause there are few options) and I will try to respond there with responsive version of this code. Thanks.

With regards.

Eric05

OK, here's the code I use :

#whole-bg-image img{
    height: 90% !important;
    width: auto !important;
    /*top: 10% !important;
    bottom: 5% !important;*/
}

Air

I told you to do it in other topic. Ehhh people ;-)

OK if you want to cancel effect on smaller screen widths add this custom CSS:

@media only screen and (max-width: 600px) {
    #whole-bg-image img{
    height: auto !important;
    }
}

This should return normal behaviour.

With regards.

Eric05

With this code, the picture is displayed the way I want :

@media only screen and (max-width: 600px) {
    #whole-bg-image img{
    height: auto !important;
    width: 90% !important;
    }
}

You can have a look :
http://www.photographe-mariage-grenoble.pro/

But in portrait mode, there is too much space between the images and the header and the slider. isn't it possible to have the same effect than hypershot : header, picture and footer visible?

By the way, the glass effect button is still visible on mobile even if I've setted it to no in glass effect option panel.

Thank you very much for your help!

Air

Eric05 said: With this code, the picture is displayed the way I want

Great:-)

Eric05 said: But in portrait mode, there is too much space between the images and the header and the slider. isn't it possible to have the same effect than hypershot : header, picture and footer visible?

You can try to alter styles if you like, it is your theme now :-) But SpaceShip looks like this, and it has its functional purposes:-)

Eric05 said: By the way, the glass effect button is still visible on mobile even if I've setted it to no in glass effect option panel.

Strange, use this custom CSS:

.glass-switch {
    display: none !important;
}

With regards.

Eric05

Eric05 said: But in portrait mode, there is too much space between the images and the header and the slider. isn't it possible to have the same effect than hypershot : header, picture and footer visible?


You can try to alter styles if you like, it is your theme now :-) But SpaceShip looks like this, and it has its functional purposes:-)

OK! But is it possible to reduce the space between image and header and image and footer? And what CSS should I alter?

Thank you for the galss effect css!

Air

Eric05 said: OK! But is it possible to reduce the space between image and header and image and footer? And what CSS should I alter?

I left it for you, cause I would not like to go in such customization(for safety of other users) . I will mark it as UNSAFE modification:

@media only screen and (max-width: 600px) {
    .single-album #mid{
        height: 50%;
    }
}

You can of course alter 50% to other value. However by default it is set to 100%.

Good luck!

With regards.

Eric05

Thank you very much, exactly what i was looking for!