Avatar of SAbboushi
SAbboushi
Flag for United States of America asked on

How to add list item before the first list item displayed on each line

Hi-
I am using php to create an unordered list (<ul>) where the list items are displayed horizontally (display: inline-block).

As I zoom, list items will jump from one line to the next.

How can I cause the first list item of all lines other than the first line to be indented?  It seems I cannot do this with php, so maybe I can have an empty list item (<li></li>) between each list item with a zero width in which case, is there something within css or javascript that would allow me to:

1) make sure that zooming always results in an empty <li> being the first item on a line (i.e. don't break between <li></li><li>content</li>

2) set the width of the first empty item on all lines other than the first to e.g. 20px

Thanks--
Sam
HTMLCSSJavaScript

Avatar of undefined
Last Comment
SAbboushi

8/22/2022 - Mon
COBOLdinosaur

You have three options, and you are probably not going to like any of them.

Learn to live with what you have.
Make the page rigid by applying absolute width in pixels to everything, so nothing wraps.
Use large enough fonts and graphics so that people with normal vision do not need to zoom to see the detail

I recommend the third options because it is best practice.  How many of your user actually need to zoom the page? If it is a large number than your design is probably not very good from an accessibility point of view.  If it is a small number than there is nothing to worry about because user with vision problems are either using reader devices, or are used to the shifts caused by zooming.

Cd&
ASKER CERTIFIED SOLUTION
SAbboushi

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
SAbboushi

ASKER
Solution found elsewhere
I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck