Unexplained White Space

Support
#1

Hello.

I am building an app with formidable forms and have been struggling to resolve it. I’d like to know why there is a space there and how I can remove it. See here: https://cl.ly/99a960

Pro seems to be causing it, i think.

To see the problem “live” click this link https://metcast.net?bypass=mc4182 and then navigate to https://metcast.net/status/advisory/377/

Thanks in advance

#2

Hi Daniel,

Thanks for reaching out.

It’s due to line breaks in your content, your content contains columns (eg. .col) which floats so the line breaks moved to the upper part.

The solution is either removing the line breaks from your added content, or add this CSS to Theme Options > CSS

    p:empty {
     display: none;   
    }

Thanks!

#3

Hello @Rad,

What would I need to remove here to avoid using CSS?

<div class="Detailed-Header-Group">
	<div class="col span_1_of_3">
        <B><font size="5">[202]</b></font>
	</div>
	<div class="col span_1_of_3">
	<b>Valid From</b>: [204] at [205] | <b>Valid Too</b> [207]</a> at [206]</a></div>
	<div class="col span_1_of_3">
	<b>Status</b>: [200]
	</div><P>

<div class="SYN">
	<div class="col span_1_of_1">
        <strong>Synopsis:</strong> [201]</p>
	</div>

<div class="Second-Last">
	<div class="col span_1_of_2">
	<strong><P>Changelog:</strong>[231]
        <strong>Issued By:</strong> [230]
        <strong>Created:</strong> [created-at]
        <strong>Updated:</strong> [updated-at]
        </div>
	<div class="col span_1_of_2">[if 198 equals=""]<a href="https://metcast.net/wxdata/placeholder.png"><img src="https://metcast.net/wxdata/placeholder.png" alt="placeholder" size=thumbnail></a>[/if 198][if 198 not_equal=""]<a href="[198 size=thumbnail]"><img src="[198 size=thumbnail]" alt=""/></a>[/if 198]<P></div>


<div class="Last">
	<div class="col span_1_of_1">
        [if 230][editlink location="front" label="Edit" page_id=3094][/if 230]
</div>
#4

Hello Daniel,

Your code is broken. Most of the tags were unclosed. You are going to resolve it by ensuring that the html code is correct. You may use this code instead:

<div class="Detailed-Header-Group">
	<div class="col span_1_of_3">
        <b><font size="5">[202]</font></b>
	</div>

	<div class="col span_1_of_3">
		<b>Valid From</b>: [204] at [205] | <b>Valid Too</b> [207] at [206]
	</div>
	
	<div class="col span_1_of_3">
		<b>Status</b>: [200]
	</div>
</div>

<div class="SYN">
	<div class="col span_1_of_1">
        <strong>Synopsis:</strong> [201]
	</div>
</div>

<div class="Second-Last">
	<div class="col span_1_of_2">
		<strong>Changelog:</strong>[231]
        <strong>Issued By:</strong> [230]
        <strong>Created:</strong> [created-at]
        <strong>Updated:</strong> [updated-at]
    </div>

	<div class="col span_1_of_2">[if 198 equals=""]
		<a href="https://metcast.net/wxdata/placeholder.png"><img src="https://metcast.net/wxdata/placeholder.png" alt="placeholder" size=thumbnail></a>[/if 198][if 198 not_equal=""]<a href="[198 size=thumbnail]"><img src="[198 size=thumbnail]" alt=""/></a>[/if 198]
	</div>
</div>

<div class="Last">
	<div class="col span_1_of_1">
        [if 230][editlink location="front" label="Edit" page_id=3094][/if 230]
	</div>
</div>

And when you insert the code, please make sure that you are using the HTML view and not the Rich Text view.

Please let us know how it goes.

#5

Perfect! Thank you :smiley:

#6

Glad we were able to help :slight_smile:

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.