View Full Version : Getting images side by side.
Cball
03-16-2007, 02:07 PM
I copied the CSS code and HTML from this link.
http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/
I put the HTML in the <div id="content">
But rather than 2 images being side by side they are all stacked up in a row one over the other like its on 4 seperate lines.
Please help... Thanks in advance.
jscheuer1
03-16-2007, 02:29 PM
Layout can be influenced by many interdependent things on a page. We would need a link to your problem page to be certain of what is causing this.
Cball
03-16-2007, 03:48 PM
Here is the link. Notice the Team A and Team B are not side by side. That is what I'm trying to accomplish.
test.html (http://www.camdentonsoftball.com/test.html)
Thanks again...
BLiZZaRD
03-16-2007, 04:07 PM
<p> elements maintain paragraph styles, meaning next available line, etc. Try removing the <p> tags in that div :)
Cball
03-16-2007, 04:30 PM
Tried removing the <p> still nothing.
I have a feeling its in the CSS code. But just a feeling.. :p
Thank you.
jscheuer1
03-16-2007, 04:57 PM
There are only 4 images on that page and the two team images aren't seen to begin with. When they are, they occupy in turn roughly the same space. I see no:
like its on 4 seperate lines
Cball
03-16-2007, 07:17 PM
I see what you are saying but on the image gallery link (http://www.dynamicdrive.com/style/cs...image-gallery/) the 4 photos it shows text links and thats what I'm trying to do instead of thumbnails. BUT even when I use the html for thumbnails it still puts them on top of each other instead of one beside the other.
I went a head and copied the EXACT code for the images off of the demo site and of course images won't show up however you can still see it stacks them.
But I want "Team A" and "Team B" to be on the same line and eventually I will have 8 teams I'm just trying to get the code figured out..
Thanks again.
BLiZZaRD
03-16-2007, 08:50 PM
.gallerycontainer{
position: relative;
float: left;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}
You may have to specify a width: 30em; (30 for example) to ensure they all lay flat.
Cball
03-16-2007, 09:15 PM
Well I kind of figured it out except in FF it's not centered like in IE.. But For now its there..
Here is what I got so far.. /test.html (http://www.camdentonsoftball.com/test.html)
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.