JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html lang="en-US">
<head>
<title> Designs By R4yL</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Art and illustrations">
<meta name="keywords" content="HTML,Digital Art,Illustrations,Art, traditional art, audio & Video editing, Portraits, Logo design, Cards, book covers, posters, business cards, environment, character">
<meta name="Designs By R4yL" content="Seun J. Akinniyi">
</head>
<style>
.footer {
background: black;
width: 100%;
height: 100px;
position: absolute;
bottom: 100;
left: 0;
}
html, body{
height:100%;
width:100%;
padding:0;
margin:0;
}
#l01 {
display: block;
margin-left: left;
margin-right: auto;
.center {
display: block;
margin-left: auto;
margin-right: right;
width: 50%;
}
}
.content {
max-width: 600px;
margin: auto;
padding: 90px;
}
table, td {
border-collapse: collapse;
text-align: center;
padding: 5px;
}
table#t01 {
width: 100%;
background-color: rgb(229,104,26);
}
table#t02 {
width: 100%;
background-color: white;
border-collapse: collapse;
}
table#t03 {
color:white;
width: 100%;
background-color: black;
padding:0;
margin:0;
}
a {
text-decoration:none;
color: white;
}
</style>
<div class="content">
<body style="background-image:url('bg1.jpg')">
<a href="index.html"><img id="l01" src="D.RLogo.jpg" alt="logo" class="center" width="148" height="95"></a>
<hr size="5">
<table id="t01" style="width:100%" table align="center" border="1px solid orange">
<tr>
<td><a href="index.html"><b>Home</b></a></td>
<td><a href="music.html"><b>Music</b></a></td>
<td><a href="art.html"><b>Art</b></a></td>
<td><a href="design.html"><b>Designs</b></a></td>
<td><a href="photography.html"><b>Photography</b></a></td>
<td><a href="store.html"><b>Store</b></a></td>
<td><a href="store.html"><b>Contact</b></a></td>
</table>
<hr size="5">
<h2...
CSS
div {
width: 100%;
}
ul li:first-child {
border-left: none;
}
li {
box-sizing: border-box;
border-left: solid 1px black;
float: left;
text-align: center;
width: 25%;
}