Remove white space Ionic 3

Question

Remove white space Ionic 3

Navigation

#1 by (-1 votes)

-1

I'm trying to remove this white space from my project.

Iwouldlikeittolooklikethis:

<ion-contentno-padding><div[ngSwitch]="Menu" >
<ion-list *ngSwitchCase="'Todosgastronomia'" >
    <ion-item  *ngFor="let produto of produtos" no-padding>
        <ion-thumbnail item-start no-padding>

        <img src="assets/imgs/mmsszjm.png" class="imgproduto">

        </ion-thumbnail>


        <h3 class="nomproduto"> {{produto.nom_produto}}  </h3>

        <h3 class="nomsubcategoria">{{produto.nom_subcategoria}} </h3>

        <h3 class="descproduto"> {{produto.desc_produto}}  </h3>

        <h3 class="valproduto">
           <font  color="#179c90">R$</font> {{produto.val_produto}}
        </h3>

        <button ion-button class="queroproduto">QUERO!</button>
      </ion-item>
    </ion-list>

I can almost make it a bit the same, however when I add a button, even though it is on the right side > > "Button I WANT!" it occupies a blank space on the other side. If anyone can help, Thanks!

html css ionic apache-cordova

asked by anonymous 09.08.2018 / 15:22

1 answer

Login with mysql always gives the error Not Found - 404 update from the license plate code of a vehicle

score -1 · Answer 1

If what you need is that the "I want" button is not below the text, I have two suggestions:

1- Include% of item-end on button:

<button ion-button item-end class="queroproduto">QUERO!</button>

2 - Leave the button in the same price tag and right align:

In the .html file:

<h3 class="valproduto">
    <font  color="#179c90">R$</font> {{produto.val_produto}}
    <button ion-button class="queroproduto">QUERO!</button>
</h3>

In the .scss file:

.queroproduto{
    position: absolute;
    right: 0px;
}