Blacklight Plugin

CSS for definition lists breaks when definition term breaks over a line

Details

  • Type: Improvement Improvement
  • Status: Reopened Reopened
  • Priority: Minor Minor
  • Resolution: Unresolved
  • Affects Version/s: 2.5
  • Fix Version/s: 3.3
  • Component/s: None
  • Description:
    Hide
    When definition list terms have two words and break across a line the CSS does not allow for the term to continue to match up with the correct term.

    I'll fix this with adding a float and width to the dd elements.

    dl.defList dd {
      float:left;
      margin:0;
      padding:2px 0;
      text-align:left;
      width:450px;
    }
    Show
    When definition list terms have two words and break across a line the CSS does not allow for the term to continue to match up with the correct term. I'll fix this with adding a float and width to the dd elements. dl.defList dd {   float:left;   margin:0;   padding:2px 0;   text-align:left;   width:450px; }

Attachments

  1. PNG File
    screenshot_dl_css_breakage.png
    (24 kB)
    Jason Ronallo
    26/May/10 9:52 AM

Activity

Ascending order - Click to sort in descending order
Hide
Permalink
Michael Levy added a comment - 20/Dec/10 10:39 AM - edited
I've seen this issue only in IE 7. Firefox and Chrome seem to render nicely.

When the <dt>field spans 2 lines and the <dd> spans only a single line, subsequent lines are not properly aligned, which leads to a confusing display.

An IE 7 screen grab showing the issue:
https://lh4.googleusercontent.com/_AUfw_qnXmHs/TQvanvcGOtI/AAAAAAAAEkA/1T5nuCcSTx8/mis-alignment.jpg

"Format:" should align with "Book" and "Language:" with "Polish".

I've spent some time trying to fix this issue but with unfortunately so far I have not been able to come up with a fix yet.

Show
Michael Levy added a comment - 20/Dec/10 10:39 AM - edited I've seen this issue only in IE 7. Firefox and Chrome seem to render nicely. When the <dt>field spans 2 lines and the <dd> spans only a single line, subsequent lines are not properly aligned, which leads to a confusing display. An IE 7 screen grab showing the issue: https://lh4.googleusercontent.com/_AUfw_qnXmHs/TQvanvcGOtI/AAAAAAAAEkA/1T5nuCcSTx8/mis-alignment.jpg "Format:" should align with "Book" and "Language:" with "Polish". I've spent some time trying to fix this issue but with unfortunately so far I have not been able to come up with a fix yet.

People

Dates

  • Created:
    26/May/10 9:52 AM
    Updated:
    23/Jan/12 1:34 PM
Atlassian JIRA (v4.1.2#531) | Report a problem | Request a feature | Contact administrators
Powered by a free Atlassian JIRA open source license for Blacklight. Try JIRA - bug tracking software for your team.