CODEWITHSUNDEEP
htmlimagecss
Tahtoh
Tahtoh

Reputation: 57

Change the background-image of a Button

Can't change the image of the button to the arrows,tried multiple things but didn't quite work.

    button .arrow{
      background-image: url("http://alexoliveira.me/Hawaii/images/chevron-left.png");
      background-repeat: no-repeat;
      background-position: 50% 50%;
      /* put the height and width of your image here */
      height: 50px;
      width: 200px;
      border: none;
    }
    
    .arrows {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      position:absolute;
    
    }
    <div class="arrows">
      		<button onClick="carousel(-1)"  class="arrow" style="width:20px;height:40px;"></button>
      		<button onClick="carousel(1)" src="http://alexoliveira.me/Hawaii/images/chevron-right.png" class="arrow" style="width:20px;height:40px;"></button>
      	</div>

Upvotes: 0

Views: 500

Answers (1)

Marouen Mhiri
Marouen Mhiri

Reputation: 1667

just update your css to button.arrow (remove the space). you have to adjust your stylesheet then

Upvotes: 1

Related Questions