1

I have created a new content type, Plants, for my web site. One of the fields, scientific name, requires special formatting. Usually it is all italics, but sometimes a mixture of italics and non-italics such as Abelia x grandiflora 'Kaleidoscope'.

To make this work I defined the field as long text. I have tried several combinations of formats and field templates using Display Suite. The only one that seems to preserve the proper italics is Format Default and Field Template Drupal default. This preservers the proper italics, but results in an empty blank line that looks pretty crummy. See image.enter image description here

Generated HTML according to Firebug:

<section class="field field-name-field-scientific-name field-type-text-long field-label-inline clearfix view-mode-full"><h2 class="field-label">Scientific name:&nbsp;</h2><div class="field-items"><div class="field-item even"><p><em>Abelia x grandiflora</em> 'Kaleidoscope'</p>

How can I eliminate the blank line or trim the white space at the end?

  • 1
    I'd like to see a browser's inspector view of this output. Is that an extra line return, or, rather, CSS margin or padding pushing down the next line? – Screenack Sep 22 '15 at 14:33
  • Thanks for asking! I meant to put that in my original question. I have updated it. – Sam Stamport Sep 22 '15 at 17:27
  • It's difficult to say without full context, but there's a number of things going on that are semantically seriously problematic. To simply address the immediate question, I'm still wondering if either your H2 or P elements have a margin-bottom or padding-bottom that is pushing the next element down? Seeing the HTML is helpful, but hovering your mouse over the various HTML elements, and watching how the Inspector shows you padding and margin information will help you figure this out. – Screenack Sep 23 '15 at 0:52
  • What do you mean by "semantically seriously problematic"? Anything that is semantically seriously problematic was generated by Drupal. I found different padding settings throughout. When I removed <p></p> the formatting was correct. The question is: How can I use Display Suite (or some other UI) to permanently remove <p></p>? – Sam Stamport Sep 24 '15 at 20:48
1

Sorry for the digression — but semantic markup does matter. This articles speaks well to what it is: https://boagworld.com/dev/semantic-code-what-why-how/

Your input filter (or, less possibly, your rich text editor) is adding the paragraph tag. Check out the input filter you're using for this field. If this filter has "Convert line breaks into HTML (i.e. <br> and <p>)" enabled, found here: admin/config/content/formats/<inputfiltername> — this could be adding paragraph tags. Keep in mind changing this will impact how all your fields that use this input filter are rendered. You can always create an additional input filter to suite your needs.

| improve this answer | |
  • 1
    Unchecking Convert line breaks ... did not fix the problem, but removing <p> from allowed HTML tags did work. – Sam Stamport Sep 25 '15 at 8:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.