Streaming live at 10am (PST)

Hide empty elements from content collection


#1

Hi,

I have trouble hiding empty elements. Please se the two pages in my collection.

This one have video-URLs in the two video-fields in the CMS. Black ones up right.
http://programbolaget.webflow.io/artist/tobbe-trollkarl

And this one doesn't.
http://programbolaget.webflow.io/artist/zillah-totte

How can I make the DIV's disappear completely in the second one?

Regards,
Tomas


#2

Hey Tomas,

Welcome to our community :) I hope you'll enjoy it!

Regarding your question, the divs do not disappear entirely due to the fact that there is a padding on the video container. If you were to remove the padding from those nodes, then they will disappear entirely due to no content being in them :)


#3

Yes, exactly. Problem is. I want that black border around the videos. :smile:

How do I accomplish that?

Really happy to have found Webflow and looking forward to take part in this vibrant community also. Thanx! :smile:


#4

I think I've solved it. What do you think about browser-compatibility on this one.

Added this to custom HEAD-code.

<style>
div.videodiv:empty { display: none }
</style>

Tomas


[CMS] Conditional element visibility?
#5

Oh, great solution! Didn't know about using :empty! Good to know you've found solution :)


#6

Tomas: Is there a similar solution for my question here? - http://forum.webflow.com/t/cms-hide-element-if-value-is-null/19833

Problem would be that the field for the collection item would need to be tested for null, vs testing the contents of a div. Any ideas?


#7

I think it should work, if during styling content, you will wrap that field with the div and then add this code to specific div class.


#8

Yep, it can work. Otherwise you will have to use JS to get this going. :smile:


#9

Just found out I can't even test. No paid subscription = no editing Head code. Oh well. I'll wait for an official response in the other thread. Thanks for your quick repsonse.


#10

Aah, bummer. :smile: No worries, glad to discuss it.


#11

#12