How to remove the pull-left class on icons?


#1

I’m trying to create a social icons area but Blocs add class pull-left that I don’t want.
I just want these icons centered.

So I exported the files and icons are left as are on Blocs.

But when I remove the class, works I as need.


#2

Hey,

You can put any bric into a column row and apply the custom class to this row. In this custom class, go to typography settings (3rd tab) and adjust the alignment to center.


#3

I did it, but is not working.

Take a look, I added a social class to this row, and chose alignment center.


#4

My icons have this class icon, so they are display: inline-block.


#5

Maybe I could just remove this alignment will works as I’m wanting. I think this is adding float-left inline.


#6

I got the problem. When add the url this icon element “convert” to a block element because the a html element maybe have this as default?


#7

Maybe is that div that we can’t see on Blocs.


#8

Resolved.

This is looking in Blocs.

And this is looking in browser.

I think the problem is that we can’t remove the bric alignment. If have this option will works fine.


#9

Did you put the column row bric first? You need to add it first inside the empty row, and then add the class to center the elements.

I recommend to use buttons (with icon enabled and text deleted) instead of icons to solve the problem with being unable to center more than 1 icon with a link. You can then add a class to the button and get rid or background color and adjust the padding to your liking.


#10

Before, thanks for your time @Eldar.

This way don’t work as I want. With buttons etc.

The problem is that when add link to a icon, A element change the icon inline-block display behavior.


#11

Hello again @marciotoledo
Maybe I didn’t understand what you want to archive.
Below is the little video I recorded for you. Important thing is you have to add the link to the button. Hope this is close to what you want to archive.