Please advise the layout idea of this kind of dividing line.

clipboard.png

as shown in the UI diagram, there is a dividing line between the first-tier category and the second-tier category, the second-tier category and the third-tier category, and the dividing line between the two second-tier categories increases with the number of third-tier categories under the above second-tier category.

is there a better layout for this kind of dividing line? The project uses react + antd-design. Thank you in advance


think of an implementation: define the lower left border through pseudo classes, splice them together through absolute positioning, and then get the first pseudo class. Setting only the lower border
alone feels feasible. If you haven't tried, you can try
clipboard.png

.
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b2290d-2b639.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b2290d-2b639.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?