开发者

multiple rows with a single UL

开发者 https://www.devze.com 2023-01-09 21:15 出处:网络
I have following: <ul> <li>copy</li> <li>copy</li> <li>copy</li>

I have following:

<ul>
<li>copy</li>
<li>copy</li>
<li>copy</li>
<li>copy</li>
<li>copy</li>
<li>copy</li>
<li>copy</li>
<li>copy</li>
... 50 rows...
<ul>

I have a 开发者_高级运维very long UL list, is there a sexy way I can split it to be 2 or 3 rows using CSS?? I cannot make multiple <ul>'s unfortunately.. :(

Thankful for any type of help.


If you styled the <li> elements with "float: left" and maybe a fixed width, they'd line up sort-of like a table. Is that what you mean?

Might also want to play with margin & padding, and set "list-style: none" because bullets or whatever would look weird.

edit — the CSS might look something like:

ul.whatever li {
  float: left; margin-left: 10px;
  width: 30%;
}

Depends on the contents etc. whether this would look better or worse of course.

0

精彩评论

暂无评论...
验证码 换一张
取 消