I want to utilize bootstrap to create some columns using predefined classes like .col-sm-, and include additional widths for smaller phones. Despite seeing the layout looking fine on Chrome and a few devices, Netbeans throws a "class not found" message for each one. Unsure if only some are actually working properly. Any clarification would be greatly appreciated!
<!DOCTYPE html>
<html lang="en">
...
<meta charset="utf-8>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/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/3.3.7/js/bootstrap.min.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<link type="text/css" rel="stylesheet" href="css/mycss.css">
...
<div class="row" style="background-color: greenyellow; color: crimson">
<div class="col-xxxs-2 col-xxs-2 col-xs-2 col-2 col-sm-2 col-md-2 col-lg-2 ">
</div>
</div>
</html>
The CSS styling is defined as follows:
@media only screen and (max-width: 328px){
.col-xxxs-1 {width: 8.33%;}
....
}