I am trying to import user's facebook friends in a div. \[code\]Friend Divs\[/code\] are not positioned properly. They are jumbling around based on length of the name.\[code\]Note:I was not able to show full name of friends because it was hard to fit in a small Friend Div.\[/code\]CSS\[code\]#jfmfs-friend-container { overflow:scroll; overflow-x: hidden; -ms-overflow-x: hidden; width:100%; height:7.6em; color: #333; background-color: #F7F7F7; padding-top: 10px;}.jfmfs-friend { cursor
ointer; float:left; height:3em; width:12em; font-size:11px; overflow:hidden; display:inline-block; margin-bottom: 0.40em;}.friend-name { padding-left: 5px; width: 60px; font-weight: bold; color: #000; font-size: 12px;}.friend-checkbox { position: relative; vertical-align:middle; margin: 0px 0px 0px;}.friend-img { padding-left: 5px; width: 28px; height: 28px;}\[/code\]HTML\[code\]<div id="jfmfs-friend-container"><div class="jfmfs-friend " id="00000000000"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/000000000/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000012"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000012/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000330"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000330/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000044"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000044/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000880"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000880/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000770"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000770/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div></div>\[/code\]Actual Result:
ointer; float:left; height:3em; width:12em; font-size:11px; overflow:hidden; display:inline-block; margin-bottom: 0.40em;}.friend-name { padding-left: 5px; width: 60px; font-weight: bold; color: #000; font-size: 12px;}.friend-checkbox { position: relative; vertical-align:middle; margin: 0px 0px 0px;}.friend-img { padding-left: 5px; width: 28px; height: 28px;}\[/code\]HTML\[code\]<div id="jfmfs-friend-container"><div class="jfmfs-friend " id="00000000000"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/000000000/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000012"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000012/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000330"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000330/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000044"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000044/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000880"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000880/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div><div class="jfmfs-friend " id="00000000770"><input class="friend-checkbox" type="checkbox"><img src="http://stackoverflow.com//graph.facebook.com/00000000770/picture" class="friend-img"><span class="friend-name">hhhhhHy uuuu</span></div></div>\[/code\]Actual Result: