www.webdeveloper.com
Page 3 of 3 FirstFirst 123
Results 31 to 32 of 32

Thread: Making Photos appear side by side AND with links to other pages.

  1. #31
    Join Date
    Nov 2013
    Location
    new york
    Posts
    68
    Quote Originally Posted by iamdelboy View Post
    Hi folks. I'm trying to make this home page - http://magzboutique.bigcaretel.com - look a bit more like http://growler.bigcaretel.com, specifically the two rows of images with photos side by side.

    As you can guess, I'm quite new to this, its my wife's fledgling business and the e-commerce host doesn't give much support for customisation of the basic templates. However, the alternative site example shows it can be done!.

    Anyways, I've been reading up as much as I can. What I want is two rows of images, with the images fitting in size-wise. One row of 2 images, and a lower row of 3 images (with maybe a further row of 3). The images in the bottom 1/or 2 rows should link to other parts of the site. Think "shop bags" / "shop jewellery" etc.

    So far I've had two conflicting html ideas, neither of which seem to work:

    Idea 1:
    Code:
    <div style="width:410px; height:105px; border:1px black; padding:5px;">
    
    <img alt="this is image #1" src="#" style="width:100px; height:100px; border:1px black; float:left;" />
    <img alt="this is image #2" src="#" style="width:100px; height:100px; border:1px black; float:left;" />
    <img alt="this is image #3" src="#" style="width:100px; height:100px; border:1px black; float:left;" />
    <img alt="this is image #4" src="#" style="width:100px; height:100px; border:1px black; float:left;" />
    <img alt="this is image #5" src="#" style="width:100px; height:100px; border:1px black; float:left;" />
    <img alt="this is image #6" src="#" style="width:100px; height:100px; border:1px black; float:left;" />
    
    </div>
    Idea 2:

    Code:
    <div>
    <center>
      
    <a href="http://www.cavitycolors.com/blog" title="News updates on current releases, shows, and more fun stuff!"><img src="http://farm8.staticflickr.com/7454/10748613415_ca435c2df2_o.png" width="190" height="144" alt=""></a>
    <a href="http://www.cavitycolors.com/category/clothing" title="Shirts, Tanktops, Hoodies, and more!"><img src="http://farm6.staticflickr.com/5488/10748503165_8dbf8f0d60_o.png" width="211" height="144" alt=""></a>
    <a href="http://www.cavitycolors.com/category/prints" title="Large and Small Giclee Prints!"><img src="http://farm6.staticflickr.com/5541/10748571766_12c663c2ab_o.png" width="211" height="144" alt=""></a>
    <a href="http://www.cavitycolors.com/category/originals" title="Original Drawings, Paintings, and Sketches for sale!"><img src="http://farm4.staticflickr.com/3782/10748503075_4eaf311962_o.png" width="211" height="144" alt=""></a>  
    <a href="http://www.cavitycolors.com/category/accessories" title="Stickers, Buttons, Toys, Books, and more!"><img src="http://farm8.staticflickr.com/7315/10748571926_4eaf311962_o.png" width="211" height="144" alt=""></a>
     
     
    <br>
    <br>
    </div>
    Naturally, I'm borrowing ideas from other places, and while one seems to have the links code it doesnt seem to have images sitting side by side. The top one does, but doesn't seem to have any linking anywhere.

    Any ideas?
    Thanks
    Delboy
    The websites you have given are invalid. Can you give correct website address. Then we can try to help you.

  2. #32
    Join Date
    Nov 2013
    Posts
    18
    Hi, coothead et al have given me the help i required thus far. thanks

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles