improve caddie display : better checkbox positionning in every tested browsers.
Opera still not perfect , but much better. git-svn-id: http://piwigo.org/svn/trunk@1518 68402e56-0260-453c-a942-63ccdbb3a9ee
This commit is contained in:
parent
7e35acd1cd
commit
8723b9cf29
4 changed files with 27 additions and 19 deletions
|
|
@ -27,7 +27,7 @@ BODY#theAdminPage #content {
|
||||||
/* Set some sizes according to your maximum thumbnail width and height */
|
/* Set some sizes according to your maximum thumbnail width and height */
|
||||||
#content UL.thumbnails SPAN,
|
#content UL.thumbnails SPAN,
|
||||||
#content UL.thumbnails SPAN.wrap2 A,
|
#content UL.thumbnails SPAN.wrap2 A,
|
||||||
#content UL.thumbnails SPAN.wrap2 LABEL,
|
#content UL.thumbnails LABEL,
|
||||||
#content DIV.thumbnailCategory DIV.illustration {
|
#content DIV.thumbnailCategory DIV.illustration {
|
||||||
width: 140px; /* max thumbnail width + 2px */
|
width: 140px; /* max thumbnail width + 2px */
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -32,14 +32,17 @@
|
||||||
<!-- BEGIN thumbnails -->
|
<!-- BEGIN thumbnails -->
|
||||||
<ul class="thumbnails">
|
<ul class="thumbnails">
|
||||||
<!-- BEGIN thumbnail -->
|
<!-- BEGIN thumbnail -->
|
||||||
<li><span class="wrap1"><span class="wrap2">
|
<li><span class="wrap1">
|
||||||
<label>
|
<label>
|
||||||
<img src="{thumbnails.thumbnail.SRC}"
|
<span class="wrap2"><span>
|
||||||
alt="{thumbnails.thumbnail.ALT}"
|
<img src="{thumbnails.thumbnail.SRC}"
|
||||||
title="{thumbnails.thumbnail.TITLE}"
|
alt="{thumbnails.thumbnail.ALT}"
|
||||||
class="thumbnail" />
|
title="{thumbnails.thumbnail.TITLE}"
|
||||||
<input type="checkbox" name="selection[]" value="{thumbnails.thumbnail.ID}" />
|
class="thumbnail" />
|
||||||
</label></span></span>
|
</span></span>
|
||||||
|
<input type="checkbox" name="selection[]" value="{thumbnails.thumbnail.ID}" />
|
||||||
|
</label>
|
||||||
|
</span>
|
||||||
</li>
|
</li>
|
||||||
<!-- END thumbnail -->
|
<!-- END thumbnail -->
|
||||||
</ul>
|
</ul>
|
||||||
|
|
|
||||||
|
|
@ -6,12 +6,13 @@
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
#content UL.thumbnails SPAN.wrap2 A,
|
#content UL.thumbnails SPAN.wrap2 A,
|
||||||
#content UL.thumbnails SPAN.wrap2 LABEL {
|
#content UL.thumbnails SPAN.wrap2 SPAN {
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#content UL.thumbnails IMG.thumbnail {
|
#content UL.thumbnails IMG.thumbnail {
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -50%;
|
top: -50%;
|
||||||
|
|
@ -19,9 +20,8 @@
|
||||||
margin-top: -40%;
|
margin-top: -40%;
|
||||||
/**/
|
/**/
|
||||||
}
|
}
|
||||||
#content UL.thumbnails SPAN.wrap2 input {
|
#content UL.thumbnails INPUT {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 2px;
|
||||||
top: -50%; /* same as other browsers but not so pretty */
|
top: 2px; /* same as other browsers but not so pretty */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -27,7 +27,7 @@
|
||||||
vertical-align: middle; /* Ok with Opera and Geko not IE6 */
|
vertical-align: middle; /* Ok with Opera and Geko not IE6 */
|
||||||
}
|
}
|
||||||
#content UL.thumbnails SPAN.wrap2 A,
|
#content UL.thumbnails SPAN.wrap2 A,
|
||||||
#content UL.thumbnails SPAN.wrap2 LABEL {
|
#content UL.thumbnails LABEL {
|
||||||
display: block;
|
display: block;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
@ -36,12 +36,17 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
/* label and input used for caddie in admin section */
|
/* label and input used for caddie in admin section */
|
||||||
#content UL.thumbnails SPAN.wrap2 LABEL {
|
#content UL.thumbnails LABEL {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
:root #content UL.thumbnails SPAN.wrap2 INPUT { /* hide from Opera */
|
|
||||||
position: absolute;
|
#content UL.thumbnails INPUT {
|
||||||
left: 0;
|
position: relative; /* <= Opera can handle relative here */
|
||||||
top: 0;
|
top: -20px;
|
||||||
|
}
|
||||||
|
:root #content UL.thumbnails INPUT { /* hide from Opera */
|
||||||
|
position: absolute; /* <= Opera hide 1 checkbox over 2 !!! */
|
||||||
|
left: 2px;
|
||||||
|
top: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue