List of steps to reproduce (step by step, including full links if applicable):
- View any page containing definition lists eg
; valerian :herbal supplement
(or equivalent html e.g.
<dl><dt>valerian</dt><dd>etc</dd></dl>
- View page to see issue
- Error is most apparent when viewing the code, where dd is undefined and dt is defined twice
What happens?:
- definition dd tag not formatted so ends up in a different font to the dt line above
- dd padding is incorrect
- definition term dt looks small due to the serif font, and this looks odd when used on a page with other text not in a definition list
What should have happened instead?:
- dd defined
- consistent look and feel
- no redundant code
Software version (if not a Wikimedia wiki), browser information, screenshots, other information, etc:
All browsers, but tested on safari
Problem code:
- screen-common.css
dt {
font-weight: normal;
font-family: @fonts-secondary;
line-height: 1.125;
margin: 1.25em 0 0.5em;
}
dt {
font-weight: bold;
font-family: @fonts-secondary;
line-height: 1.125;
margin: 1.5em 0 0.5em;
margin-bottom: 0.1em;
}Solution: alter first dt to be dd and inherit fonts instead of using secondary (serif) fonts:
dd {
font-weight: normal;
font-family: inherit;
line-height: 1.125;
margin: 1.25em 0 0.5em;
dt {
font-weight: bold;
font-family: inherit;
line-height: 1.125;
margin: 1.5em 0 0.5em;
margin-bottom: 0.1em;
}