Ion-grid rowspan

Ionic Framework ionic-v3
1

How to implement rowspan on ion-grid to make it look like this:

image
image838×1078 80 KB

2

Make two columns and give the size 2 & 8, in 8 one insert the image.

Like this

<ion-row>
  <ion-col size="2">
    <div>
      <ion-label>
        <h1>1</h1>
      </ion-label>
    </div>

    <div>
      <ion-label>
        <h1>2</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>3</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>4</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>5</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>6</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>7</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>8</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>9</h1>
      </ion-label>
    </div>
    <div>
      <ion-label>
        <h1>10</h1>
      </ion-label>
    </div>
  </ion-col>
  <ion-col size="8">
    <img src="../../noticable.jpg" alt="">
  </ion-col>
</ion-row>
1 Like
3

Thank you so much! It worked!

4

My Pleasure :slight_smile: