Spaces in the classes


#1

I can not insert spaces in the classes.
To change the Fonts in the @Lucas Swiper you have to create a “slider-inner–info h1” class with relative spaces.
but Blocs converts spaces into dashes “-”!
How to do?


#2

Add the class via the class manager, the class can’t be added to the object it needs to be added to the project.


#3

Watch how i did this in the video, as Norm says use the Class Manager:


#4

But what about when you absolutely MUST have spaces in the Class name AND you must also add that class to the object? For example, how does one go about creating these effects on an image in Blocs?

At the bottom of that web page, it gives code examples, but there are several required classes that have spaces in the name. Again, how does one do this in Blocs?

The code also specifies a DIV within a DIV, but I can’t seem to accomplish that feat in Blocs either.

@Pealco?

Thanks.


#5

Classes with spaces added to DOM objects are treated individual classes separated by the space. This is the way browser render and read classes, it’s nothing unique to Blocs.


#6

Then how do these Bootstrap Hover Effects work? Click the link and scroll down that page and examine the code. You can see how they use classes with spaces in the names as well as a DIV inside a DIV.


#7

They will be individual classes.

Blocs automatically replaces the space for a - which you can see in those code examples.


#8

I tried it and couldn’t get it to work, probably due to the fact we cannot put a DIV inside a DIV as they describe in the code at the bottom of that web page.


#9

Yeah I’ll investigate that.


#10

@JDW, you have to call their css and js.
You can see how it works in here:

So to that work in Blocs, you have to call their CSS and after that the JS, and they have a specific order. After that you can add the HTML that you refer in the way @Norm explain.

There is their base project:
MDB-Free_4.zip (2.4 MB)

And this is the project with one of your example:
MDB-Free_4 - JDW.zip (2.4 MB)

And this is a blocs project working all together: (yes you’r correct about div inside a div, and probably @Norm can find a way) (there you have the bloc, the sources that you have to reconnect when it starts and the exported site with the example).
JDW4.zip (1012.6 KB)

hope it helps…


#11

Actually, you can’t, as I said earlier, because that code requires a DIV inside a DIV, and Blocs doesn’t allow us to do that (unless we use a Code Widget, which gets messy).


#12

I edit my last post please check it…


#13

Wow, thank you, @Pealco.

I see that these 3 files are needed:

mdb.min.css, 259K
mdb.min.js, 212K
popper.min.js, 21K

But that is 492K for those 3 files!

Obviously, for page file size reasons, it’s probably best to avoid adding those affects entirely.

Anyway, thank you for your kind help!