I'm designing the bottom section for a website that should contain three lists, arranged horizontally, each with its own points, which are links or text.
I tried to create an unordered list, with 3 other unordered lists as points, each having its own <li> points.Then the outer list use flexbox to display other lists titles and it work, but link1,link2,etc are still horizontal.
.endpage { width: 100%; background-color: #333; position: fixed; height: 100px; bottom: 0;}.endpage ul { display: flex;}.endpage-titles { list-style: none; padding-left: 10%; padding-right: 10%; padding-top: 2%; font-family: djr-banner-bold; font-size: 28px; letter-spacing: 2px; text-shadow: 1px #000; color: #ffffff;}<div class="endpage"><ul class="endpage-titles"><ul class="endpage-subtitles">CONTACTS</ul><li>link1</li><li>link2</li><li>link3</li><ul class="endpage-subtitles">LINKS</ul><li>link1</li><li>link2</li><ul class="endpage-subtitles">MAPS</ul><li>link1</li></ul></div>