[wp-trac] [WordPress Trac] #61130: WP 2024 Theme CSS Bug

[WordPress Trac]

#61130: WP 2024 Theme CSS Bug
-------------------------------------------------+-------------------------
 Reporter:  strukturdoktor                       |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  Awaiting
                                                 |  Review
Component:  Bundled Theme                        |     Version:  6.5
 Severity:  normal                               |  Resolution:
 Keywords:  reporter-feedback needs-screenshots  |     Focuses:
-------------------------------------------------+-------------------------
Changes (by sabernhardt):

 * keywords:   => reporter-feedback needs-screenshots


Old description:

> Hi there,
>
> I use WP 2024 Version 6.5.2 an 2024 Theme Version 1.1. I use standard
> bullet points in the List element. The bullet points are left outside the
> surrounding box, and depending on the other elements below they
> disappear.
>
> I used following code in the custom css:
> ul li {
>  list-style-position:inside;
> }
>
> Then, the bullet points are more or less in the right position, but then
> some errors occur:
> - In the Block Editor the bullet point is on one line and the text is
> shown on the next line
> - In normal view mode, the bullet points and text is shown properly, but
> if there is an automatic line break, the text starts at the beginning of
> the new line and is not indented correctly

New description:

 Hi there,

 I use WP 2024 Version 6.5.2 an 2024 Theme Version 1.1. I use standard
 bullet points in the List element. The bullet points are left outside the
 surrounding box, and depending on the other elements below they disappear.

 I used following code in the custom css:
 {{{
 ul li {
  list-style-position:inside;
 }
 }}}

 Then, the bullet points are more or less in the right position, but then
 some errors occur:
 - In the Block Editor the bullet point is on one line and the text is
 shown on the next line
 - In normal view mode, the bullet points and text is shown properly, but
 if there is an automatic line break, the text starts at the beginning of
 the new line and is not indented correctly

--

Comment:

 Hi and welcome to WordPress Core Trac!

 > The bullet points are left outside the surrounding box, and depending on
 the other elements below they disappear.

 Could you share images and/or steps to reproduce your issues with the
 bullets disappearing (without any custom styles) in Twenty Twenty-Four?

 > if there is an automatic line break, the text starts at the beginning of
 the new line and is not indented correctly

 When list items are set to [https://developer.mozilla.org/en-
 US/docs/Web/CSS/list-style-position list-style-position: inside], the text
 **should** wrap to the next line beneath the bullet point (list marker).
 If that is not the style you want, you probably would prefer increasing
 the padding on the list instead of editing `list-style-position`. For
 example, you could double the default indentation with something like this
 (specifically within the post content area, and not affecting nested
 lists):
 {{{
 .entry-content > ul {
   padding-left: 2rem;
 }
 }}}

 > In the Block Editor the bullet point is on one line and the text is
 shown on the next line

 The editor has a rich text `div` element inside the List Item block, and
 that may need to retain the element's `display: block` default style.
 However, you could open an issue on the Gutenberg repository to consider
 changing that to `display: inline` for anyone else who might have the list
 marker's position set to `inside`.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/61130#comment:2>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform