Issue: Pictures - Browser - glitch

Issue Tools
- View Changes

May 2, 2016 4:46 PM

brindosch

Junior Member

Pictures - Browser - glitch

Now we run into a "big" issue for the users, our bigger pictures shift out of the layout.
At least on IE11, latest FF.
Chrome is no issue, so i never saw it.

Testpage: https://hyperion-project.org/wiki/Hyperion-Log

I appreciate all your work you invest at your product. We will continue our subscription soon anyway
Thank you

Edit1: found: "display:inline-block" from the class: vw-img-inline
Result: the images are no longer shifted out of their parent frame. But now i need to check the ratio

Edit2: found: "display: flex;" from class "vw-img-link" ->ratio recovered

As quick fix i overwrite both with display:block, but now pictures are at the center. played a little bit around with the css but no idea now.

Issue Details

Issue Number 4659

Issue Type Bug

Project VaultWiki 4.x Series

Category Styling / CSS

Status Fixed

Priority 5 - Minor Bugs / Small Tweaks

Affected Version 4.0.10

Fixed Version 4.0.11

Milestone (none)

Software DependencyXenForo 1.x

License TypeLite

Users able to reproduce bug 0

Users unable to reproduce bug 0

Attachments 0

Assigned Users (none)

Tags (none)

May 3, 2016 9:19 AM

pegasus

VaultWiki Team

Please restore the CSS so I can fully understand the problem.

I think vw-img-inline only needs "max-width: 100%"

Reply
May 3, 2016 10:23 AM

brindosch

Junior Member

I removed the changes via "browser" "overwrite", now i get this:
Not sure where i need to add this line at the vw css source (file?)

http://imgur.com/U6oktZN

Reply
May 3, 2016 10:44 AM

pegasus

VaultWiki Team

The template is called vw_attach.css

Reply
May 3, 2016 11:39 AM

brindosch

Junior Member

Thank you.
sadly not the complete solution
https://hyperion-project.org/wiki/Hyperion-Log

On chrome - good
on IE11/FF - wrong "ratio"

Reply
May 3, 2016 12:12 PM

pegasus

VaultWiki Team

In IE11, ratio looks okay to me, unless you made another change. Only problem is Firefox. For Firefox, add
"justify-content: center; object-fit: contain;"
Then remove "display: flex" from .vw-img-link

Reply
May 3, 2016 12:22 PM

pegasus

VaultWiki Team

Marking as Fixed in 4.0.11.

Reply
May 3, 2016 1:48 PM

brindosch

Junior Member

Where is THIS class located? It is not inside vw_attach.css (to remove the display:flex)

.vw-img-link {
max-width: 100%;
justify-content:center;
object-fit: contain;
}

Reply
May 3, 2016 1:50 PM

pegasus

VaultWiki Team

At the bottom of vw_attach.css

Reply
May 3, 2016 1:54 PM

brindosch

Junior Member

Yes, in just this second i found it myself. sorry!
Great, thank you

/Fixed

Reply

+ Reply

All times are GMT -4. The time now is 7:12 AM.

This site uses cookies to help personalize content, to tailor your experience, and to keep you logged in if you register.
By continuing to use this site, you are consenting to our use of cookies.

Learn more… Accept Remind me later

Welcome to VaultWiki.org, home of the wiki add-on for vBulletin and XenForo!

Issue: Pictures - Browser - glitch

Issue Tools