Images wont display inline

[Zygoma]

Hi from 8 degress c York UK...

on this page i cant get the right hand side thumbnail pics to sit inline, instead they stack under each other, here is the offending page:http://www.davidclick.com/portfolio-fix4.html

The thumbnail images should look like this -
http://www.davidclick.com/york-pavil...ing-vision.htm

Now before i posted this i did check the images were set to display inline, they are as the code below shows, i suspect an inheritance problem..

#aside ul {
  margin: 0 0 10px 0;
  padding: 0;
  float: left;
  text-align: center;
  background-color: #fff;
  line-height: 1em;
  list-style: none; 
  position: relative;
  
}


#aside ul li {
  display: inline;
  margin: 0;
  padding: 0;
}

#aside ul a {
  display: block;
  float: left;
  margin: 0 10px 10px 0;
  padding: 4px 4px 6px 4px;
  border: 0;
  background-color: #fff;
  text-align: center;
  width: 80px;
}

#aside ul a:hover {
  background-color: #CDCC00;
  border: 0;
}

Any insights welcome :-)

[ralph.m]

Try adding this:

#aside ul {
  margin: 0 0 10px 0;
  padding: 0;
  float: left;
  text-align: center;
  background-color: #fff;
  line-height: 1em;
  list-style: none; 
  position: relative;
  width:200px;
}

[Zygoma]

Thanks Ralph you fixed it!

[ralph.m]

Glad that helped. (I'm not totally sure why the width was needed, but I guess if the container and its content are floated, there's nothing to stop them wrapping like that. I need to understand the finer points of CSS better.)

[donboe]

I usually don't use a width for the UL but have the< li's> floated! So far without the problems of wrapping!