Complete Code For Flip An Image Using Cascading Style Sheets.
<!DOCTYPE html> <html> <head> <title>How Do I Flip An Image Using Cascading Style Sheets</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/> </head> <style> body{ background: #ffcccc; } .image1:hover { transform: scalex(-1); } .image2:hover { transform: scaley(-1); } .well{ display: flex; } .padding{ padding: 20px; } </style> <body> <br/><br/> <div class="container"> <br> <div class="text-center"> <h1 id="color" style="color: black;">Flip An Image Using Cascading Style Sheets</h1> </div> <br> <div class="well"> <div class="padding"> <img src="../image/hd.jpg" alt="Paris" width="400" height="300" class="image1"> </div> <div class="padding"> <img src="../image/hd.jpg" alt="Paris" width="400" height="300" class="image2"> </div> </div> </div> </body> </html>