JSFiddle - React, Tailwind, and code Playground

by Michael Mickelson

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>

<div class="container">
  <div class="row-fluid">
    <div class="col-xs-4">
      <div id="select_txt" class="alert alert-success">
        <strong>some text to copy</strong>

        <button class="btn btn-secondary btn-sm" type="button" onclick="copy_data(select_txt)" style="float: right;">
          <i class="glyphicon glyphicon-copy"></i>copy</button>
      </div>
    </div>
    <div class="col-xs-4">
      <div class="alert alert-success">
        <a href="#">site1</a>
      </div>
    </div>
    <div class="col-xs-4">
      <div class="alert alert-success">
        <a href="#">site2</a>
      </div>
    </div>
  </div>
</div>

CSS

html, body, .container, .row-fluid, .col-xs-4 {
  height: 100%;
  
}
body {
  font-family: "roboto", monospace;
  height: 100%;
}

.alert-success {
  width: 100%;
  min-height: 100%;
  text-align: center;
}