Issue: CSS text-wrapping issue with creator & contributer usernames (XenForo: .ugc a:link)

Issue Tools
- View Changes

September 23, 2018 10:22 PM
ACL

Regular Member
CSS text-wrapping issue with creator & contributer usernames (XenForo: .ugc a:link)

New for VaultWiki 4.0.24 on XenForo (including the default XF theme), the last character of usernames in the page footer area (vw-list-contributors) is being wrapped onto a new line, for both the 'created by' and 'last updated by' username. E.g.:

Code:

Last updated by: Usernam e

The issue appears to be caused by the margin property and value for the following XenForo CSS rule, from xenforo.css

Code:

.ugc a:link, .ugc a:visited { color: rgb(71, 112, 20); padding: 0 3px; margin: 0 -3px; border-radius: 5px; }

Temporarily removing the margin values for the above selector fixes this. This overriding rule also fixes this issue for me:

Code:

.ugc .vw-list-contributors a:link, .ugc .vw-list-contributors a:visited { margin: 0; }

EDIT: Actually, the same XenForo CSS rule also causes section head links to appear bunched up. Fixed with:

Code:

.ugc .vw-head-links a:link, .ugc .vw-head-links a:visited, .ugc .vw-list-contributors a:link, .ugc .vw-list-contributors a:visited { margin: 0; }

Issue Details

Issue Number 5493

Issue Type Bug

Project VaultWiki 4.x Series

Category Styling / CSS

Status Fixed

Priority 5 - Minor Bugs / Small Tweaks

Affected Version 4.0.24

Fixed Version 4.0.25

Milestone (none)

Software DependencyXenForo 1.x

License TypePaid

Users able to reproduce bug 0

Users unable to reproduce bug 0

Attachments 0

Assigned Users (none)

Tags (none)

September 24, 2018 4:03 PM

pegasus

VaultWiki Team

Fixed both cases in the next release. Giving the links display: inline-block is preferable so that any custom margins can still be used. It appears to be a difference in the way Firefox renders inline elements with negative margins while inside an inline-block container.

Reply
September 25, 2018 7:09 AM
ACL

Regular Member
Nice, thank you!

One more type of link to report: The bunching issue is also occuring with .tag class links in the tag box below page content. The whole hover shadow effect is different to how XenForo styles the tag items and I don't think it looks quite right here.

Here is how VaultWiki is rendering tags: https://www.vaultwiki.org/xf-wiki/in...ki/&title=Demo
... and how XenForo does it: https://www.vaultwiki.org/xf/index.p...tle-gif.14395/

Perhaps the .ugc class would be better removed from the blockquote element and instead added to the nested div 'vw-content-only'. This makes the tag items appear normal again. It also solves the page contributor username wrapping issues.

Code:

<div class="vw-content-only ugc ...

Or better still, move the ugc class down to each page section 'vw-section', which is along the lines of how XF 1.x applies this class to each post content individually, and not the links around it (for example, the post permalink beneath a post's content). This helps distinguish user-contributed links in messages (and wiki articles) from other links.

Code:

<div class="vw-section ugc ...
Reply
September 25, 2018 10:04 AM

pegasus

VaultWiki Team

Moved the blockquote element to surround the content directly rather than surrounding the content-container in the next release. This should resolve all the issues discussed here (but may introduce others). .ugc cannot be added directly to vw-section as that would be in conflict with another completed request for 4.1.x.

Reply

+ Reply

All times are GMT -4. The time now is 2:08 PM.

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: CSS text-wrapping issue with creator & contributer usernames (XenForo: .ugc a:link)

Issue Tools