Jump to content

Height doesn't change in css


Recommended Posts


I am trying to make a site for a studio, and I wanted to set a specific hover effect for my text. I want the background of the text to be lit up in the full height of the nav bar but it doesn't do it. I showed the expected result in the png in the attached files. I will also set the code here below, the top part is a css reset.



<!doctype html>
<meta charset="UTF-8">
    <link href="style.css" rel="stylesheet" type="text/css">
    <link rel="preconnect" href="https://fonts.gstatic.com"> 
<link href="https://fonts.googleapis.com/css2?family=Offside&display=swap" rel="stylesheet">

    <div id="nav_bar">
        <div id="Zendex">ZENDEX</div>
    <a href="contact.html"><li>CONTACT</li></a>
    <a href="films.html"><li>FILMS</li></a>
    <a href="about.html"><li>ABOUT</li></a>
    <a href="home.html"><li>HOME</li></a>
    <div class="main"></div>


@charset "UTF-8";
/* CSS Document */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
body {
    line-height: 1;
    background-color: #6A6969;
ol, ul {
    list-style: none;
blockquote, q {
    quotes: none;
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
table {
    border-collapse: collapse;
    border-spacing: 0;


    overflow: hidden;
    position: fixed;
    top: 0;
    width: 100vw;
    height: 125px;
    background-color: #484848;
    border: solid 1px black;

    font-size: 24px;
    text-shadow: 1px 1px 100px white;
    font-family: 'Offside', cursive;
    float: right;
    margin: 45px 50px 0px 0px;
    height: 125px;

    font-size: 24px;
    text-shadow: 1px 1px 100px white;
    font-family: 'Offside', cursive;
    float: left;
    margin: 45px 0px 0px 100px;
    color: azure;





    margin: 0px 50px 0px 0px;
    color: azure;
    height: 125px;

    color: white;

    height: 125px;
    background-color: #6A6969;
    color: white;

css problem.png

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...