Background Images card not displaying


#1

Background Images card not displaying
the text is appearing below the image please help ionic 2


#2

This question has been asked some time ago, but since there are no answers and I’m having the same problem, I’m trying to ask it again.

I can’t manage to create background image on a card.

This is what I tried:

 <ion-card>
    <img src=(url)/>
    <p>(some text)</p>
 </ion-card>

This will create a card with an image and text underneath the image, not a background image.

I tried styling it with scss files:

.card {
background:(url);
}

 <ion-card class="card">
        <p>(some text)</p>
  </ion-card>

But it doesn’t seem doing anything. Image wouldn’t render at all.

What I’m trying to achieve is the image to take the entire card and a text on top of it.

Thanks.


#3
.card {
  background:url(<your_url>);
}

or

<ion-card>
  <img [src]="url"/>
  <p>(some text)</p>
</ion-card>

#4

Tried it.

In the first case the image wouldn’t render at all.

The second case doesn’t look like valid syntax. What exactly do you mean by [src]? Can you give me an example?

Thanks.


#5

Wut? What about read documentation?