Skip to content

Instantly share code, notes, and snippets.

@chrissearle

chrissearle/bs52.html

Created June 6, 2023 09:48
Show Gist options
  • Save chrissearle/680a3f39ff9e4995ba35beea594d2590 to your computer and use it in GitHub Desktop.
Save chrissearle/680a3f39ff9e4995ba35beea594d2590 to your computer and use it in GitHub Desktop.
Download ZIP
Bootstrap
Raw
bs52.html
<html>
<head>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js"
integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V"
crossorigin="anonymous"
></script>
</head>
<body class="bg-success">
<div class="container m-5">
<h1 class="text-white">Bootstrap 5.2</h1>
<p class="text-white">
Table with class text-white and bg-success gets the same background as
the surrounding body which is also bg-success
</p>
<table class="table text-white bg-success">
<thead>
<tr>
<th>Head</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cell</td>
</tr>
<tr>
<td>Cell</td>
</tr>
<tr>
<td>Cell</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Raw
bs53.html
<html>
<head>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.min.js"
crossorigin="anonymous"
></script>
</head>
<body class="bg-success">
<div class="container m-5">
<h1 class="text-white">Bootstrap 5.3</h1>
<p class="text-white">
Table with class text-white and bg-success gets no background colour
</p>
<table class="table text-white bg-success">
<thead>
<tr>
<th>Head</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cell</td>
</tr>
<tr>
<td>Cell</td>
</tr>
<tr>
<td>Cell</td>
</tr>
</tbody>
</table>
<p class="text-white">
Table with class table-success gets a different shade and ignores
text-white
</p>
<table class="table table-success text-white">
<thead>
<tr>
<th>Head</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cell</td>
</tr>
<tr>
<td>Cell</td>
</tr>
<tr>
<td>Cell</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment