FAQ4.html Commit Revert

classic Classic list List threaded Threaded
6 messages Options
Reply | Threaded
Open this post in threaded view
|

FAQ4.html Commit Revert

Oleg Pahl
Hi @All,



could you be so kind to revert this commit in FAQ 4?

https://cvsweb.openbsd.org/cgi-bin/cvsweb/www/faq/faq4.html.diff?r1=1.495&r2=1.496


Commit message : convert two ugly bullet lists into definition lists because that's what they are.
ok tj
---



Before >

After >

BR,

Oleg Pahl

PastedImage-2.png (74K) Download Attachment
PastedImage-1.png (75K) Download Attachment
Reply | Threaded
Open this post in threaded view
|

Re: FAQ4.html Commit Revert

Andras Farkas
For me, faq4.html displays fine in Firefox, lynx, and Chromium, both
with and without the CSS.

On Thu, Jan 2, 2020 at 10:47 AM Oleg Pahl <[hidden email]> wrote:

>
> Hi @All,
>
>
>
> could you be so kind to revert this commit in FAQ 4?
>
> https://cvsweb.openbsd.org/cgi-bin/cvsweb/www/faq/faq4.html.diff?r1=1.495&r2=1.496
>
>
> Commit message : convert two ugly bullet lists into definition lists because that's what they are.
> ok tj
> ---
>
>
>
> Before >
>
> After >
>
> BR,
>
> Oleg Pahl

Reply | Threaded
Open this post in threaded view
|

Re: FAQ4.html Commit Revert

Diogo Galvao
In reply to this post by Oleg Pahl
On Thu, Jan 2, 2020 at 12:46 PM Oleg Pahl <[hidden email]> wrote:
>
> could you be so kind to revert this commit in FAQ 4?
>
> https://cvsweb.openbsd.org/cgi-bin/cvsweb/www/faq/faq4.html.diff?r1=1.495&r2=1.496
>

Instead of reverting the commit, this change in CSS fixes the problem:

- dt { margin-left: 40px; float: left; }
+ dt { margin-left: 40px; float: left; clear: left; }

However, depending on fonts and font sizes, rows on the second column
may still get slightly misaligned with respect to the first column.
Fixing this would require one more workaround, if you're so inclined:

+ dd:after { content: ""; display: block; clear: both; }

Reply | Threaded
Open this post in threaded view
|

Re: FAQ4.html Commit Revert

Anthony J. Bentley-4
Diogo Galvao writes:
> On Thu, Jan 2, 2020 at 12:46 PM Oleg Pahl <[hidden email]> wrote:
> >
> > could you be so kind to revert this commit in FAQ 4?
> >
> > https://cvsweb.openbsd.org/cgi-bin/cvsweb/www/faq/faq4.html.diff?r1=1.495&r
> 2=1.496
> >
>
> Instead of reverting the commit, this change in CSS fixes the problem:

What browser are you using that misrenders the page like that?

Reply | Threaded
Open this post in threaded view
|

Re: FAQ4.html Commit Revert

Diogo Galvao
On Fri, Jan 3, 2020 at 6:37 PM Anthony J. Bentley <[hidden email]> wrote:
>
> What browser are you using that misrenders the page like that?

Firefox 71.0. It must have something to do with monospace font
rendering on Windows. If you want to simulate the problem, try
adding the CSS below:

dt { height: 18.5px; }
dd { height: 18px; }

Those are the heights computed by Firefox on this machine.

Even if there was no problem, the current style dt { float: left; }
isn't very solid for the expected behavior. This becomes clear if we
manually introduce line breaks inside one of those <dt> tags. This is
not a real example in this case, of course, but it shows how an element
could be pushed beside a previous floated element. If it's desired for
an element to be moved below another floating element that precedes it,
the clear CSS property must be set.

And for now this is probably more bikeshedding CSS than tech@ is
willing to waste time with. But I hope it helps.

Reply | Threaded
Open this post in threaded view
|

Re: FAQ4.html Commit Revert

Anthony J. Bentley-4
Diogo Galvao writes:
> On Fri, Jan 3, 2020 at 6:37 PM Anthony J. Bentley <[hidden email]> wrote:
> >
> > What browser are you using that misrenders the page like that?
>
> Firefox 71.0. It must have something to do with monospace font
> rendering on Windows.

Thanks. These details were necessary to reproduce the problem.

> Even if there was no problem, the current style dt { float: left; }
> isn't very solid for the expected behavior. This becomes clear if we
> manually introduce line breaks inside one of those <dt> tags. This is
> not a real example in this case, of course, but it shows how an element
> could be pushed beside a previous floated element. If it's desired for
> an element to be moved below another floating element that precedes it,
> the clear CSS property must be set.

Yes, we should avoid brittleness. But rather than use several display,
float, clear, and content properties to continue styling definition
lists the way we have been, I think replacing with a simple table will
be more appropriate. In general, www should be editable by mere mortals.