+ Reply to Thread
Results 1 to 3 of 3

Thread: Thumbnails

  1. #1

    Thumbnails

    I'm a newbie, learning html and css. I'm creating a art site for a friend and come unstuck with the thumbnails page. The problem is that i want to create 2 rows of 4 thumbnails, in the example below i have used 6 images but the fourth image goes onto the second row and is shown as the sixth image, rather than being on the first row as the fourth image! I dont know what i am doing wrong, any ideas anyone?

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    	<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    	<title>Starchild Work</title>
    	<meta http-equiv="Content-Language" content="en-us" />
    	
    	<meta http-equiv="imagetoolbar" content="no" />
    	<meta name="MSSmartTagsPreventParsing" content="true" />
    	
    	<meta name="description" content="Description" />
    	<meta name="keywords" content="Keywords" />
    	
    	<meta name="author" content="Starchild" />
    	
    	<style type="text/css" media="all">@import "css/master.css";</style>
    	
    	
    </head>
    
    <body>
    
    <div id="page-container">
    	
    	<div id="main-nav">
    		<div id="altnav">
    		<a href="index.html">HOME</a> 
    		<a href="introduction.html">INTRODUCTION</a> 
    		<a href="work.html">WORK</a> 
    		<a href="exhibitions.html">EXHIBITIONS</a> 
            <a href="projects.html">PROJECTS</a>
    		<a href="links.html">LINKS</a> 
    		<a href="contact.html">CONTACT</a><br/>
    		<a href="frame.html">ON FRAME</a> 
    		<a href="canvas.html">ON CANVAS</a> 
    		<a href="paper.html">ON PAPER</a> 
            <a href="board.html">ON BOARD</a>
    </div>
    	
    <div id="header">
    	<h1><img src="starchild.jpg" width="263" height="71" /></h1>
    </div>
    	
      
      	<div id="content">
      	
      	<div class="img"><a target="_blank" href="americaeatsitsyoung175.html"><img src="Images/on board/America Eats its Young175.jpg" alt="America Eats Its Young" width="175" height="175" vspace="53" margin="20"<a/>
      
    </div>
    
    <div class="img"><a target="_blank" href="hatecandy.html"><img src="Images/on board/Hate Candy175.jpg" alt="Hate Candy" width="175" height="175" vspace="40"<a/>
    
    </div>
    
    <div class="img"><a target="_blank" href="happyendingmachine.html"><img src="Images/on board/Happy Ending Machine175.jpg" alt="Happy Ending Machine" width="175" height="175" vspace="40"<a/>
    
    </div>
    
    <div class="img"><a target="_blank" href="heavypetting.html"><img src="Images/on board/heavy petting175.jpg" alt="Heavy Petting" width="175" height="175" vspace="40"<a/>
    
    <div class="img"><a target="_blank" href="iglom.html"><img src="Images/on board/I GLOM175.jpg" alt="I Glom" width="175" height="175" vspace="40"<a/>
    
    <div class="img"><a target="_blank" href="lightsoutbaby.html"><img src="Images/on board/Lights Out Baby!175.jpg" alt="Lights Out Baby!" width="175" height="175" vspace="40"<a/>
    
    </div>
        
    <div id="footer"></div>
    
    </div>
    </div>
    
    </body>
    </html>


  2. #2
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    	<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    	<title>Starchild Work</title>
    	<meta http-equiv="Content-Language" content="en-us" />
    	
    	<meta http-equiv="imagetoolbar" content="no" />
    	<meta name="MSSmartTagsPreventParsing" content="true" />
    	
    	<meta name="description" content="Description" />
    	<meta name="keywords" content="Keywords" />
    	
    	<meta name="author" content="Starchild" />
    	
    	<style type="text/css" media="all">@import "css/master.css";</style>
    	
    	
    </head>
    
    <body>
    
    <div id="page-container">
    	
    	<div id="main-nav">
    		<div id="altnav">
    		<a href="index.html">HOME</a> 
    		<a href="introduction.html">INTRODUCTION</a> 
    		<a href="work.html">WORK</a> 
    		<a href="exhibitions.html">EXHIBITIONS</a> 
            <a href="projects.html">PROJECTS</a>
    		<a href="links.html">LINKS</a> 
    		<a href="contact.html">CONTACT</a><br/>
    		<a href="frame.html">ON FRAME</a> 
    		<a href="canvas.html">ON CANVAS</a> 
    		<a href="paper.html">ON PAPER</a> 
            <a href="board.html">ON BOARD</a>
    </div>
    	
    <div id="header">
    	<h1><img src="starchild.jpg" width="263" height="71" /></h1>
    </div>
    	
      
      	<div id="content">
      	
      	<div class="img"><a target="_blank" href="americaeatsitsyoung175.html"><img src="Images/on board/America Eats its Young175.jpg" alt="America Eats Its Young" width="175" height="175" vspace="53" margin="20"<a/>
      
    </div>
    
    <div class="img"><a target="_blank" href="hatecandy.html"><img src="Images/on board/Hate Candy175.jpg" alt="Hate Candy" width="175" height="175" vspace="40"<a/>
    
    </div>
    
    <div class="img"><a target="_blank" href="happyendingmachine.html"><img src="Images/on board/Happy Ending Machine175.jpg" alt="Happy Ending Machine" width="175" height="175" vspace="40"<a/>
    
    </div>
    
    <div class="img"><a target="_blank" href="heavypetting.html"><img src="Images/on board/heavy petting175.jpg" alt="Heavy Petting" width="175" height="175" vspace="40"<a/>
    
    <div class="img"><a target="_blank" href="iglom.html"><img src="Images/on board/I GLOM175.jpg" alt="I Glom" width="175" height="175" vspace="40"<a/>
    
    <div class="img"><a target="_blank" href="lightsoutbaby.html"><img src="Images/on board/Lights Out Baby!175.jpg" alt="Lights Out Baby!" width="175" height="175" vspace="40"<a/>
    
    </div>
        
    <div id="footer"></div>
    
    </div>
    </div>
    
    </body>
    </html>

  3. #3
    Idiosyncratic Member ;) likethegoddess's Avatar
    Join Date
    May 2008
    Gender:
    Location
    San Francisco, Calif.
    Posts
    796
    Looks like you haven't closed all of your individual image divs.
    likethegoddess design for musicians and non-profits
    Portfolio | Twitter | FriendFeed

+ Reply to Thread

Similar Threads

  1. Help! how do I fix pixelated thumbnails and rollovers?
    By jai.villa in forum Graphic Design and Web Design Help
    Replies: 4
    Last Post: 20-11-2008, 03:49 PM
  2. Scrolling thumbnails
    By philjohns in forum General Web Design Forum
    Replies: 4
    Last Post: 23-07-2008, 09:38 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts


The Graphics Forum Web Design Stuff Free Decent Downloads Free Quality Wallpapers Graphics Forum Free Vista Themes
The Top The Best Images Tech Talk 247 Logo Design - $149 Affordable Stock Vector Illustrations Creativecurio - Design Blog Graphic Design Advertising

Check the forum often for the latest design announcements. Everything from graphic design and web design, to films and music. Estetica is a great place for people to get together and help each other out.



Web Hosting - UK Web Hosting services for business or personal website hosting needs.

Dedicated Servers - A full range of Managed Dedicated Server solutions suitable for all your requirements.

Graphic Design Blog | Web Design Forum | Graphic Design and Print Forum | Graphic Design Links | Advertise On This Site

Web Design UK | Vision.To Design | Leaflet Printing | Estetica Design Forum's Privacy Policy

Flyer Printing | Photography Blog | Design Forum Links | Logo Design | Graphic Design Social Network | Logo Design

Graphic Design Tutorials | Logo Designer | UK Logo Design Studio | Land for sale | Vector Art Blog

Free Web Hosting | Custom Logo Design - $149 Only | Affordable Print Design Templates | Small Business Logo Design | Company Logo Design

Logo Design Service | Logo Design Firm | Logo Design Reseller | Custom Logo Design | Letterhead Printing | Flyer Printing | Business Card Printing

Printing | Leaflet Printing | Online Backup | T-Shirt Printing | Personalised Mugs | Canvas Printing

Search Engine Optimization by vBSEO 3.5.0 RC1 PL1