Syntax error Set orange border on an element in Bootstrap to indicate danger

Set orange border on an element in Bootstrap to indicate danger

To set orange border to an element, use the border-warning class −

<div class="mystyle border border-warning">
  Danger (Orange border)
</div>

Set the style for the element −

<style>
.mystyle {
  width: 200px;
  height: 100px;
  margin: 10px;
}
</style>

Let us see an example to implement the border-warning class in Bootstrap −

Example

Live Demo

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Bootstrap Example</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
    <style>
    .mystyle {
      width: 200px;
      height: 100px;
      margin: 10px;
    }
    </style>
  </head>
<body>
  <div class="container">
    <p>The following are two Rectangles:</p>
    <div class="mystyle border border-warning">Danger (Orange border)</div>
  </div>
</body>
</html>
Updated on: 2020-06-18T13:57:46+05:30

202 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements