tfixed link paired with images - monochromatic - monochromatic blog: http://blog.z3bra.org
(HTM) git clone git://z3bra.org/monochromatic
(DIR) Log
(DIR) Files
(DIR) Refs
---
(DIR) commit 8125e37d21b2d0786517469ab3b794787d4702a1
(DIR) parent d6a26ac9a894e6896d2f2ce630477710bfcbd046
(HTM) Author: Willy Goiffon <w.goiffon@gmail.com>
Date: Fri, 9 Aug 2013 19:18:53 +0200
fixed link paired with images
Diffstat:
M 2013/08/test-your-css.html | 6 +++---
M css/monochrome.css | 11 ++++++++++-
2 files changed, 13 insertions(+), 4 deletions(-)
---
(DIR) diff --git a/2013/08/test-your-css.html b/2013/08/test-your-css.html
t@@ -27,12 +27,12 @@
<cite>Richard M. Stallman</cite> said <q>La cuisine indienne favorise les plats curryeux.</q><br />
But... What about blockquotes ?! Let's test :
- <cite>Douglas Everett</cite>
<blockquote>
<p>
There are some people who live in a dream world, and there are some who face reality;
and then there are those who turn one into the other.
</p>
+ — <cite>Douglas Everett</cite>
</blockquote>
That was a fine quote. Now, go on !
</p>
t@@ -44,8 +44,8 @@
<h3>Images</h3>
<p>
- <a href='/img/2013-08-ratpoison.jpg'>
- <img src='/img/thumb/2013-08-ratpoison.jpg' alt='ratpoison screenshot' />
+ <a class='a_img' href='/img/2013-08-ratpoison.jpg'>
+ <img class='a_img' src='/img/thumb/2013-08-ratpoison.jpg' alt='ratpoison screenshot'/>
</a>
<span class='caption'>← Ratpoison screenshot — Uses "ratpoison -c set border 28" to make the shot sexier</span>
</p>
(DIR) diff --git a/css/monochrome.css b/css/monochrome.css
t@@ -225,9 +225,18 @@ blockquote {
/* Images and associated text {{{ */
img {
+ width:30%;
vertical-align: top;
display: inline-block;
- box-shadow: 4px 4px 16px #000;
+ box-shadow: 0px 0px 16px #000;
+}
+
+img.a_img:hover {
+ box-shadow: 0px 0px 16px #fff;
+}
+
+a.a_img:hover {
+ text-decoration: none;
}
/* Comment images - use with <span> or <div> */