Przyklejona belka zasłania mi content

pytanie zadane 30 marca 2017 w HTML i CSS przez Michał_Warmuz Mądrala (5,830 p.)

Cześć. Robie stronkę do szkoły i mam problem przykleiłem górną belke do "góry" ale kiedy chcę podtym dać nagłówek nic nie ma zauważyłem że jest "pod" belką. Pomożecie ?

<!doctype html>
<html lang="PL">
<head>
	<title>Rowery</title>
	<meta charset="utf-8">
	<meta name="description" content="Skelp rowerowy. Nalepsze rowery w Polsce!">
	<meta name="keywords" content="rowery, sklep, bike, shop">
	<meta name="author" content="Michał Warmuz">
	
	<meta http-equiv="X-Ua-Compatible" content="IE=edge,chrome=1">
	
	<link rel="stylesheet" href="main.css">
	<link rel="stylesheet" href="css/fontello.css">
	<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&amp;subset=latin-ext" rel="stylesheet">
	
	<!--[if lt IE 9]>
	<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
	<![endif]-->
</head>
<body>
<header>
<div id="header">
	<div id="logo">
		<h1>Rowery</h1>
	</div>
	<nav>
		<div id="nav">
			<ul>
				<li>Strona Główna</li>
				<li>Nasz sprzęt</li>
				<li>O nas</li>
				<li>Kontakt</li>
			</ul>
		</div>
	</nav>
	<div style="clear: both;"></div>
</div>
</header>
<main>
	<section>
		<h1>sdkfosd</h1>
	</section>
</main>
</body>
</html>

CSS:

body
{
	margin: 0;
	background-color: #2F3336;
	color: #efefef;
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
}
#header {
	background-color: black;
	padding: 2px;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}
#logo {
	float: left;
	margin-left: 100px;
}
#logo h1 {
	
	letter-spacing: 5px;
	text-transform: uppercase;
}
#nav {
	float: right;
	list-style-type: none;
	margin: 0;
	margin-right: 100px;
	margin-top: 20px;
	font-size: 20px;
}
#nav  li {
	display: inline;
	list-style-type: none;
	margin-right: 10px;
}
#nav li:first-child {
	color: #E8980E;
}

3 odpowiedzi

odpowiedź 30 marca 2017 przez imklau Nałogowiec (42,090 p.)
wybrane 30 marca 2017 przez Michał_Warmuz

Najlepsza

do tej sekcji pod "belką" dodaj position: absolute i top: 100px, lub raczej wysokość "belki"

komentarz 30 marca 2017 przez Michał_Warmuz Mądrala (5,830 p.)

tak tak jak tak zrobię to działa tylko zastanawiam się dlaczego mi nagłowek nie wyświetla się pod belką ?

komentarz 30 marca 2017 przez imklau Nałogowiec (42,090 p.)

bo nagłówek należy właśnie do tej belki ;p

odpowiedź 30 marca 2017 przez skav3n Gaduła (3,900 p.)

odpowiedź 30 marca 2017 przez Filius Gaduła (4,120 p.)

możesz dodać szybko tylko inline styling (chociaż nie powinno się tego robić, zawsze możesz nadać klase lub id i przenieść do styli css

<main style="margin-top: 150px;">
    <section>
        <h1>sdkfosd</h1>
    </section>
</main>