vuetify icon indicating copy to clipboard operation
vuetify copied to clipboard

[Bug Report][3.3.4] <ul><li> doesn't show bullet points, list-style-type is ignored

Open scscgit opened this issue 2 years ago • 6 comments

Environment

Vuetify Version: 3.3.4 Last working version: 2.5.7 Vue Version: 3.3.4 Browsers: Opera, Mozilla Firefox OS: Windows 10

Steps to reproduce

Use <ul><li>First</li></ul> within Vuetify 3.

Expected Behavior

Unordered list displayed with bullet points with no further setup, beginner-friendly. image

Actual Behavior

There is no bullet point. This worked in Vuetify 2 correctly, causing a migration blocker. image CSS property list-style-type doesn't work either.

Reproduction Link

https://play.vuetifyjs.com/#...

scscgit avatar Jun 16 '23 12:06 scscgit

https://github.com/vuetifyjs/vuetify/pull/13609/files#diff-04bdabb50b2d4ad49979a6e6c4a1d28181f99687ab96a537209662947be7803e

The padding reset has always been there, but in v2 we had some overrides to bring it back.

KaelWD avatar Jun 16 '23 13:06 KaelWD

Same here, I found the same bug in version 3.3.5. No bullet points are shown.

vessi-devs avatar Jun 21 '23 00:06 vessi-devs

as pointed in #17677 , it's not a probelm of bullet points not shown, but list that don't align right with the container, so in this exemple, the bullets overflow to the left of the page and are not shown. image nested list are broken too

<ul>
  <li>python
    <ul>
      <li>django</li>
      <li>strawberry</li>
      <li>scripting random</li>
    </ul>
  </li>
</ul>

shobu13 avatar Jun 23 '23 17:06 shobu13

It works for me if I put "padding all" or "padding left" on the parent component

<ul class="pl-5">
  <li>python
    <ul class="pl-5">
      <li>django</li>
      <li>strawberry</li>
      <li>scripting random</li>
    </ul>
  </li>
</ul>

dulimarta avatar Jan 22 '24 19:01 dulimarta

This appears to be caused by the padding reset.

* {
  padding: 0; /* Reset `padding` and `margin` of all elements */
}

iamface avatar Mar 25 '24 01:03 iamface

I'm experiencing the same issue with Vuetify 3.7.1 and Vue 3.4.38. No bullet points are shown.

piris-jose avatar Oct 14 '24 15:10 piris-jose