XF 1.2 How to proper add css style to images

[Kazaam]

Hello,

I just tried to add some extra css style to every images of every messages. Before to do this, I could enlarge big images by clicking on them - a little popup appeared, but now I added some extra css style I can't enlarge them anymore, the popup doesn't appear.

When I remove this extra css style, the enlarging feature works. I don't understand what's wrong.

What I added in EXTRA.css:

.messageText img {
    max-width: 786px !important;
    -moz-box-shadow: 2px 2px 10px 0px #141414;
    -webkit-box-shadow: 2px 2px 10px 0px #141414;
    -o-box-shadow: 2px 2px 10px 0px #141414;
    box-shadow: 2px 2px 10px 0px #141414;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#141414, Direction=134, Strength=10);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;   
}

Example: http://gamepunchers.net/threads/propositions-daméliorations.619/

Is there a proper way to add some style to keep this feature?

 

[Paul B]

You have a max width of 786px set, which is narrower than the post width.

Additionally, the lightbox is only triggered by attachments, not embedded images.

Other than that, you have attachments restricted for guests so it's difficult to see what the issue is.

 

[Kazaam]

Yes, I put this max width to keep the shadow effect on the right of the images. If the image is scaled to the post width, it won't shows

Is there an other way to trigger the lightbox?

Guests can see attachements now, sorry

 

[Lukas W.]

Maybe this explanation will help you on your way.

 

[Kazaam]

Ah! Good to know, thank you.