Ok, I am really lost with CSS and something this simple would prob take me a couple hours to learn how to do this. If anyone can help me out with some basic CSS for this it would be very helpful. I don't want to have to use tables on my arcade site that uses a CSS tableless template. What I need to do is display a 120x90 image, and below it the name of the game. and I want to have the blocks displayed side by side. GAME 1 GAME 2 GAME 3 GAME 4, etc. I just need to know how I would make a CSS block to do this, lol, either inline style or I can add it to my stylesheet. Any help is appreciated. This is the page I'm looking to use the code for. I just got things spaced out right now until I get the proper coding http://www.sharkysgames.com/sharkys/19/free-games-for-my-website.html
Create the styles: .arcadebox { /* change the height, padding, font, size to whatever*/ float: left; width: 120px; height: 140px; padding: 0 15px 15px 0; text-align: center; font-family: arial; font-size: 10px; } .arcadebox img { padding: 0 0 5px 0; border: 0; } Then when you want to put a box in: <div class="arcadebox"> <a href="linkname.htm" title="Link Name"><img src="image.jpg" alt="Alt text" /></a> <a href="linkname.htm" title="Link Name">Link name</a> </div> ...something like that would probably work, I haven't tested it though. It'll just keep tiling 120 x 140 boxes, with 15 pixels space to the right and underneath each one, with a picture inside with 5 pixels underneath it, and then a centered text description.