Mark Lewis
Mark Lewis

Reputation: 179

Weird float behavior for li w/images

Not sure how to describe it. Why aren't the last two li floating correctly?

Site: http://symphonyninjas.com/interviews/

Upvotes: 0

Views: 83

Answers (2)

Matthew Darnell
Matthew Darnell

Reputation: 4588

The LIs are all floating, but the images are different heights. The fifth image is hitting the third image and sitting next to it instead of underneath it.

Clear the float when you want to start a new row. You already have a class on that LI to remove the margin, simply add clear:left;

.photo-id.first, .first.interviewee {
    [...]
    clear: left;
}

Upvotes: 1

Curtis
Curtis

Reputation: 103348

Add clear:left:

.photo-id.first, .first.interviewee {
   margin-left: 0;
   clear: left;
}

Upvotes: 2

Related Questions