Remove padding from item

1

Can I make an item with an item-thumbnail-left have no padding?

I tried adding padding=“false” and the class=“no-padding” but it didn’t create tight lil’ list items like I want.

1 Like
2

How does this work for you? Just got to make sure you’re targeting the right class in css

1 Like
3

Try this:

css file:

.no-padding {
    padding: 0px !important;
}

html file, add the class “no-padding” to your div or item:

<a class="item no-padding">
. . .
</a>
3 Likes
4

Worked thanks! more to come :o)

5

Is there a reason this isn’t part of the base css? It seems like a commonly needed feature.

1 Like
6

I’ve solved the same way you did!

7

The funny thing is that there is already a style within Ionic which does exactly this, it’s called: “row-no-padding”.

This is meant for usage within grids (row/column), however the funny thing is that “row-no-padding” works anywhere, not just within a grid.

This may not exactly look intuitive or semantic in your template markup, but it works.

1 Like
8

I understood that I need to add .np-padding {} in css file but can you please help me to understand second part.
In html currently my code is as below , should I write <ion-item class=…

9

just add no-padding inside item tag like this <item no-padding></item>

10

Probably because the only thing it does is add styling as far as I know.