From a463ba1840ed289691994e66ee3cdbd4b02b04d8 Mon Sep 17 00:00:00 2001
From: Kévin Le Gouguec <kevin.legouguec@gmail.com>
Date: Mon, 28 Dec 2020 17:04:34 +0100
Subject: Align dropdown with parent div

Highlight backgrounds were misaligned otherwise.

And tweak padding so that the whole line is clickable.
---
 commun.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/commun.css b/commun.css
index 7eb648b..6db6981 100644
--- a/commun.css
+++ b/commun.css
@@ -68,7 +68,6 @@ nav > ol > li {
     padding: 0.5em 0.1em;
 }
 
-/* TODO fix horizontal padding which misaligns white backgrounds on quatuor page */
 /* TODO highlight current quatuor member */
 nav li.dropdown {
     position: relative;
@@ -76,6 +75,7 @@ nav li.dropdown {
 nav li.dropdown ul {
     display: none;
     position: absolute;
+    left: 0;                    /* Offset nav > ol > li padding. */
     padding-left: 0;
     width: 100%;
     background: white;
@@ -87,13 +87,13 @@ nav li.dropdown:hover ul {
 }
 nav li:hover ul li {
     list-style-type: none;
-    padding-inline-start: 10%;
 }
 nav li.dropdown > ul > li:hover {
     background: lightgrey;
 }
 nav li.dropdown > ul > li a {
     display: block;       /* Make link span whole containing block. */
+    padding-inline-start: 10%;
 }
 
 .current {
-- 
cgit v1.2.3