logo-dw

Go Back   Dreamweaver Club Forums > Hand Coders Forum > HTML and CSS
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 01-16-2009, 05:12 PM   #1
silverglade
 
Join Date: Sep 2008
Posts: 306
Default trying to get a second row of this image gallery

hi, im trying to get a second row of this image gallery, i tried using the <p> tag to separate the divs, but it didnt work. any help greatly appreciated. the code below is for one row only of images. id like two.

here is the css/html

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<html>
<head>
<style type="text/css">
div.img
  {
  margin: 2px;
  border: 1px solid #0000ff;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
  }
div.img img
  {
  display: inline;
  margin: 3px;
  border: 1px solid #ffffff;
  }
div.img a:hover img
  {
  border: 1px solid #0000ff;
  }
div.desc
  {
  text-align: center;
  font-weight: normal;
  width: 120px;
  margin: 2px;
  }
</style>
</head>
<body>

<div class="img">
  <a target="_blank" href="flower1.html">
  <img src="product1_9385.jpg" alt="Klematis" width="110"
  height="90" />
  </a>
  <div class="desc">Add a description of the image here</div>
</div>
 
<div class="img">
  <a target="_blank" href="klematis2_big.htm">
  <img src="klematis2_small.jpg" alt="Klematis" width="110"
  height="90" />
  </a>
  <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
  <a target="_blank" href="klematis3_big.htm">
  <img src="klematis3_small.jpg" alt="Klematis" width="110"
  height="90" />
  </a>
  <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
  <a target="_blank" href="klematis4_big.htm">
  <img src="klematis4_small.jpg" alt="Klematis" width="110"
  height="90" />
  </a>
  <div class="desc">Add a description of the image here</div>
</div>

</body>
</html>
silverglade is offline   Reply With Quote
Old 01-16-2009, 07:08 PM   #2
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

It's going to wrap automatically once the horizontal width is reached.
If you need to control the width of the gallery further, wrap the image gallery in a DIV with a set width.
domedia is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 09:51 AM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com