• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 134
  • Last Modified:

Unordered lists used to format content

On the following page, www.saiprograms.com/paris, I do not understand how the unordered list is used to format the  content so that it appears the way it does. For example, how do the first two pictures (and their accompanying text)  appear side by side instead of below each other (as they would typically appear) if you used an unordered list? To format content so that it appears across a page, you would normally use either a <div> or a <table>.

If someone could explain to me how it works, I would appreciate it. I have attached the code as well as the relevant parts of the CSS.
1 Solution
If you inspect the element using your browsers dev tools, you can see the CSS that's being used. In this case, the list elements are being floated, which allows them to sit side by side.

ul.program-list li {
float: left;
display: inline;
width: 260px;
margin: 0 40px 40px 0;

Open in new window

More about CSS floats:
geeta_m9Author Commented:

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now