CSS cross-browser implementation of float:center_Experience exchange

We hope that li is floating and centered (the number of li is not fixed and the width of ul is unknown). You can set ul's text-align:center, and then set li's display to achieve centering, but this is not our original intention. We need to implement float:center.

Here we have to review position:relative first, which will offset the position in the normal document flow based on left, right, top, bottom and other attributes. Then we can make ul position: relative; left: 50%, and then let li float to the left, and then make it position: relative; right: 50% (or left: -50%), then li floats to the middle. Same as centered. Without further ado, let’s try it first.