Menu
When I change the text size in the div (id="home"), it also changes the size of the div. I want to be able to change the text size without the div size changing every time.
Here is the HTML:
<!DOCTYPE html>
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
<link type="html/css" rel="stylesheet" href="websiteCSS.css"/>
<title>PROTOTYPE</title>
</head>
<body>
<div id="sidebar"></div>
<div id="home" class="header">Home</div>
</body>
</html>
and the CSS:
body{
margin: 0;
background: #d5e9d7;
}
#sidebar {
z-index: 1;
position: fixed;
width: 20%;
height: 100%;
margin-top: 0;
margin-left: 0;
#background-color: light blue;
background-image: linear-gradient(to bottom, #545454 0%, #424242 100%);
margin-bottom: 10px;
}
.header {
position: fixed;
width: 2.5em;
height: 1em;
padding: 8px;
background-color: #b2b2b2;
margin-top: 0.5%;
margin-left: 20.5%;
font-family: 'Josefin Sans', sans-serif;
font-size: 2em;
color: #333333;
}
.header:hover {
font-size: 2.1em;
}
700
You could set your div size in px or set a min-width or min-height attribute.
77
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
