Vuetify: [Bug Report] "display: inline-block" CSS property on <v-menu> component

[AlexSHoffman]

Versions and Environment

Vuetify: 1.0.1
Vue: 2.5.16
Browsers: Chrome 65.0.3325.162
OS: Windows 10

Steps to reproduce

Un-comment the v-menu component in the codepen to see how it affects the element below it

Expected Behavior

Is there a particular reason why an invisible component needs display: inline-block; which affects visible components on the page?

Actual Behavior

<v-menu> component has display: inline-block; which moves all the elements below it when you add it on the page.

Reproduction Link

https://codepen.io/anon/pen/WzjoGz

[KaelWD]

Is there a particular reason why an invisible component needs display: inline-block;

Probably not, that's only really needed if it has an activator.

[ebisbe]

Use full-width prop if you don't want the display: inline-block;
@KaelWD it's not a bug

[AlexSHoffman]

@ebisbe well, how is it not a bug? The context menu is not supposed to occupy any space on the page. Wouldn't you agree? See the codepen.

I'm not sure how are people supposed to know they should use full-width prop to remove invisible block from the page? Especially when the description of this prop says Forces 100% width

[ebisbe]

@AlexSHoffman if you read my PR that has been closed you'll find the explanation. If it's not a bug then the documentation should be updated to explain this styling behaviour.

[AlexSHoffman]

@ebisbe yeah, I agree it's not really a "bug" in itself, but it's just confusing. Either the description of full-width prop should be updated (and state it should be used for context menus) or there should be a prop called context-menu that would do the same thing basically.

[johnleider]

We are removing activator elements in the near future so this wont matter.

[KaelWD]

The bug is that it should only have the inline style if the activator slot is used.

[johnleider]

Oh well sure, that's valid. Should be an easy PR if anyone is feeling 🐸 froggy

[ebisbe]

I'll try it

On Tue, Jul 10, 2018, 18:46 John Leider [e-mail] wrote:

Oh well sure, that's valid. Should be an easy PR if anyone is feeling 🐸
froggy

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/vuetifyjs/vuetify/issues/3645#issuecomment-403890344,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGb3OodunKTaiuBJj9NztnLQoalY5OjIks5uFNpigaJpZM4S20vh
.

>

Enric Bisbe Gil