Footer floating right
Closed this issue · 2 comments
On both Hebrew and Genizah QA sites, HTML like the following is added by the XSL (but only on those manuscripts in the Genizah collection):
<div class="footer">
<h3>Catalogue Images</h3>
<ul>
<li><a href="/images/catalogue/Catalogue-1_p012a.jpg">p012a</a></li>
<li><a href="/images/catalogue/Catalogue-1_p012b.jpg">p012b</a></li>
</ul>
<h3>Fragment Images</h3>
<p style="float:right;"><a href="/fragments/full/MS_HEB_a_1_1a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_1a.jpg" alt="MS_HEB_a_1_1a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_1b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_1b.jpg" alt="MS_HEB_a_1_1b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_2a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_2a.jpg" alt="MS_HEB_a_1_2a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_2b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_2b.jpg" alt="MS_HEB_a_1_2b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_3a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_3a.jpg" alt="MS_HEB_a_1_3a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_3b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_3b.jpg" alt="MS_HEB_a_1_3b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_4a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_4a.jpg" alt="MS_HEB_a_1_4a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_4b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_4b.jpg" alt="MS_HEB_a_1_4b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_5a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_5a.jpg" alt="MS_HEB_a_1_5a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_5b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_5b.jpg" alt="MS_HEB_a_1_5b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_6a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_6a.jpg" alt="MS_HEB_a_1_6a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_6b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_6b.jpg" alt="MS_HEB_a_1_6b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_7a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_7a.jpg" alt="MS_HEB_a_1_7a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_7b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_7b.jpg" alt="MS_HEB_a_1_7b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_8a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_8a.jpg" alt="MS_HEB_a_1_8a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_8b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_8b.jpg" alt="MS_HEB_a_1_8b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_9a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_9a.jpg" alt="MS_HEB_a_1_9a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_9b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_9b.jpg" alt="MS_HEB_a_1_9b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_10a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_10a.jpg" alt="MS_HEB_a_1_10a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_10b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_10b.jpg" alt="MS_HEB_a_1_10b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_11a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_11a.jpg" alt="MS_HEB_a_1_11a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_11b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_11b.jpg" alt="MS_HEB_a_1_11b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_12a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_12a.jpg" alt="MS_HEB_a_1_12a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_12b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_12b.jpg" alt="MS_HEB_a_1_12b.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_13a.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_13a.jpg" alt="MS_HEB_a_1_13a.jpg" height="80" /></a><a href="/fragments/full/MS_HEB_a_1_13b.jpg" style="display: inline-block; float:right;"><img src="/fragments/thumbs/MS_HEB_a_1_13b.jpg" alt="MS_HEB_a_1_13b.jpg" height="80" /></a></p>
</div>
Note the style
attributes on the p
and a
elements are added because the images are of Hebrew texts, so should be read from right-to-left.
But one of the CSS files is applying a float:right;
directive to the .footer
class, meaning the whole thing floats right, which is incorrect. The h3
headings should line up on the left along with all the headings in the main body of the manuscript description.
On production, now live, the "Catalogue Images" and "Fragment Images" headings - inside the <div class="footer">
-are still misaligned, on Genizah by a lot...
https://genizah.bodleian.ox.ac.uk/catalog/volume_17#MS_Heb_b_5-part19-item1
...and on Hebrew only slightly...
https://hebrew.bodleian.ox.ac.uk/catalog/volume_17#MS_Heb_b_5-part19-item1
I've cleared my cache, so I don't think that's the issue. @ahankinson just did a deploy, so they should be up-to-date with your latest CSS.
I will fix this in the XSL by moving the div created for these elements into the one with the class of "msDesc".