Greetings,

I am developing a css gallery for a website I am making. I have it almost done, but I am tripping up over this error.

I like the functionality of the titles and the images, but when a gallery is shorter than the list of galleries you cannot access the bottom one. You have to be able to run your mouse from the title to the gallery, and there is a gap there.

Unfortunately, whenever I set any sort of height attribute on the ul.gallery it scrambles the display. The background goes in front of the images and it will not select the galleries right.

Can anyone give me any ideas of what to do? Thanks.

3 answers

1
point

You have multiple ul.gallery, the last ul.gallery is positioned on top of the first (the first one contains the images). If you want to reverse the order, use z-index to control that. E.g. use classnames like gallery1, gallery2 and assign z-index like

ul.gallery1 { z-index: 10; } ul.gallery2 {z-index: 9; }

And you would also need to remove left:0 or right:8em, you cant specify both for an absolutely positioned element. If you remove either, then you would have to specify a width.

Answered about 7 years ago by Divya Manian
  • I am designing it to be able to be generated by a php script, so that would be rather difficult, but not impossible to implement. I have never heard of not being able to set both the right and left sides of an absolutely positioned element. How would you specify a width in this situation? It needs to be out from the right by the width of the titles, and yet fill #gallery all the way to the left. Jay Lauser about 7 years ago
  • you can specify the width of the titles as x% of the total parent width, and 100-x% as the width of the ul element. Divya Manian about 7 years ago
Rob 230
0
points

Which browser? I don't see the problem in Firefox.

Answered about 7 years ago by Rob
  • i see the problem in FF 3.5.3 i'd bet ti's a problem in all browsers because the showing of the gallery thumbnails is dependent on it's title being hovered. when your mouse leaves the gallery name it reverts to showing gallery1. jenny ham about 7 years ago
  • Ah, yes, I see. I misunderstood the problem. Rob about 7 years ago
Rob 230
0
points

Well, the problem is due to positioning it absolutely which causes the other element to break out of that box since absolutely positioned elements are removed from the normal flow.

Answered about 7 years ago by Rob