Anelok vs. CSS

Werner Almesberger werner at
Tue Jul 28 07:31:43 UTC 2015

I gave the Anelok Web page a bit of a face-lift:

Alas, CSS and I aren't friends. So the menu looks the way I want
it to look (*) on Chromium (43.0.2357.81):

But the boxes are a bit taller, and the boxes and "Personal Password
Safe" both are too low on Firefox (39.0):

Meanwhile, rekonq (2.4.2) places everything too high:

You can see my clumsy attempts at getting CSS to behave in
and there especially

I basically tossed in every hack and tweak I saw mentioned on Stack
Exchange, hoping I could do this with margins / padding / etc. and
alignment. Then I gave up and just forced placement with "position".
So some of the things may be redundant or even contradictory.

(*) I.e.,
  - logo and "Personal Password Safe" begin at the top of the
  - the logo is just high enough above the horizontal rule that it
    has a clear visual separation,
  - the boxes are slim and sit on top of the rule, without gap or

  An alternative may be to lower the logo until the bottom line is
  at the height of the rule, then add a small gap left and right.
  Haven't tried this yet.

If anyone has an idea how to make this look more consistent across
browsers, please send patches ! :)

- Werner

More information about the discussion mailing list