Empty row above events (short code)

  • Resolved fitzkogerd

    (@fitzkogerd)


    7 years, 7 months ago

    Hey all,

    I inserted the shortcode in our page like this:

    <h2></h2>
    <h2>Hier finden Sie die geplanten Veranstaltungen der Landesgruppe Süd</h2>
    <code class=”ai1ec-autoselect”>[ai1ec cat_name=”Treffen Landesgruppe Süd” view=”stream”]

    Unfortunately the view page shows one empty row between the H2 headline and the event list. It seems that the empty row starts with a light red color.

    The plugin version is: Version 2.5.22

    How can I delete this empty row?

    Best regards
    Christian

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi @fitzkogerd,

    It looks like the calender displays immediately after your heading (H2 tags) and after a paragraph tag (P tag).

    You could remove the <p> and replace it with a break instead <br />

    Or you can use CSS to decrease the spacing after the h2 tag, or decrease spacing after the <p> tag.

    Example:

    <style>
    h2 { padding-bottom: 5px !important; }

    Thread Starter fitzkogerd

    (@fitzkogerd)

    Hey Sunny Lal,

    thanks for your fast response.

    It has nothing to do with <p> or <br> as I haven′t used them.

    I added 3 screenshots in the bottom of the page: https://demo.puli.de/landesgruppe-sued/
    1. I inserted the same heading on to of the existing with a text to show that this enpty row is not there.
    2. Second screenshot is showing the code.
    3. The last pich shows the page with the second heading and even more important: The empty row has a light red color in the beginning. I marked it. This is the same color like the one in the events shown below.

    It must have someting to do with the plugin, called by the shortcode.

    Thanks for having a look after that strange thing.

    Best regards
    Christian

    Hi @fitzkogerd,

    Whether you added it or not, the <P> tag appears in your source code, immediately after your <h2> tags, and can be seen on the Source Code of the page (View Source).

    I’m not sure where the space is coming from, but, it can be solved using the small pixel size (ie 5px) negative margin (ie -5px) or negative padding (ie -5px) for either the bottom of that <h2> tag, or, top of the <p> tag as described (hopefully). Or you can make a div to hold the calendar like this:

    <div style=”padding-top: 0 !important; margin-top: 0 !important;”>
    <ai1ev>
    </div>

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Empty row above events (short code)’ is closed to new replies.