'ello all,
I am having some CSS issues with a site I am working on:
http://www.philau.edu/library/singlebullet
The design calls for a set of images, and then as one navigates through sections, the images slide out and panels overlay on top of the images:
[image section]
[panels]
This requires two sections of content that are positioned on top of each other
<div class=“cr-titles”>
and
<section class=“imagesection”>
My strategy was to use a containing div, content
<content>
</content>
And then place the the two sections that will overlay within that…using, then the content section to
control the horizontal positioning of the two sections that will overlay.
I thought this would allow to specify that both sections of content will have the same vertical position. However, in Firefox, the third panel (Warren Commission Appointment) is positioned lower than the sections before it.
Further, in Chrome, the positioning is very different, causing the text to be cut off.
How can I setup my CSS to ensure both sections are overlaid properly, in both Firefox and Chrome?
Thanks so much for your help.