css - Aligning images in a straight line

I have 5 images and a div on my webpage. When I load my page the images come one under another but what I want to do is that the images should come in a straight line and the div should show only one at a time.HTML CODE:\[code\]<html><head><title>My City Karachi</title><script src="http://code.jquery.com/jquery-1.9.1.js"></script><link rel="stylesheet" href="http://stackoverflow.com/questions/15597008/css/slider.css" type="text/css" /></head><body style="margin: 0; padding: 0;"><div class="slider"> <img src="http://stackoverflow.com/questions/15597008/asd.jpg"/> <img src="http://stackoverflow.com/questions/15597008/baba dedo.jpg"/> <img src="http://stackoverflow.com/questions/15597008/picccccture 3.jpg"/> <img src="http://stackoverflow.com/questions/15597008/Page-3.jpg"/> <img src="http://stackoverflow.com/questions/15597008/Page 4 copy.jpg" /></div></body></html>\[/code\]CSS CODE:\[code\]@charset "utf-8";html, body { margin: 0; padding: 0;}.slider { margin: 0 auto; overflow: hidden;}.slider img { width: 900px; height: 650px; float:left;}\[/code\]I hope I was clear enough!Any help would be highly appreciated! :)
 
Back
Top