example/index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title>Example</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <script type="text/javascript" src="src/jquery.fillwidth.js"></script>
  <script>
    $(function(){
      //
      // Generate a random ul of placekittens
      //
      var kittens = "<ul>"
        , imageDimensions = []
        , height =  200;
      for(var i = 0; i < 20; i++) {
        randWidth = Math.ceil(50 + (Math.random() * 600));
        imageDimensions.push({ width: randWidth, height: height });
        kittens += "<li>"
                + "<img src='http://placekitten.com/" + randWidth + "/" + height + "'>"
                + "<br><ul>"
                +   "<li>Inner List</li>"
                +   "<li>Item 2</li>"
                + "</ul>"
                + "</li>";
      }
      kittens += "</ul>";
      $('body').append(kittens);

      //
      // Apply fillwidth passing in the widths stored above to avoid initial flickering.
      //
      $('body > ul').fillwidth({ imageDimensions: imageDimensions });
    });
  </script>
  <style>
    li {
      margin: 0 15px 15px 0;
    }
    img {
      height: 200px;
      background: #eee;
    }
    li > ul {
      display: inline;
    }
  </style>
</head>

<body>
</body>
</html>