<!DOCTYPE HTML>
<html>
<head>
<title>Silverworx | Home</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header">
<div id="logo">
</div>
<h1>
<div id="navmenu">
<ul>
<li class="webdesign"><a href="#">Webdesign</a></li>
<li class="webhosting"><a href="#">Webhosting</a></li>
<li class="overons"><a href="#">Over ons</a></li>
<li class="contact"><a href="#">Contact</a></li>
</ul>
</h1>
</div>
</div>
<div id="body">
</div>
<div id="footer">
<div id="links">
<a href="#">Webdesign</a><br>
<a href="#">Webhosting</a><br>
<a href="#">Over ons</a><br>
<a href="#">Contact</a>
</div>
<p class="footer">© Silverworx 2014</p>
<div id="logo2">
</div>
</div>
</body>
</html>
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;
}
body {
margin: 0;
}
p {
margin: 0;
}
#header {
margin: 0;
height: 60px;
width: 100%;
background: #fff;
color: #fff;
float: left;
border-bottom: 1px solid #000;
}
#logo {
margin-top: 5px;
margin-left: 15px;
height: 45px;
width: 450px;
float: left;
background: url(silverworxhome.png);
}
#navmenu {
margin-left: 52%;
margin-top: 5px;
padding: 0;
width: 47%;
height: 45px;
}
#navmenu ul {
padding: 0;
margin-top: 10px;
list-style: none;
}
#navmenu ul li a {
color: #909090;
text-decoration: none;
display: block;
font-family: Verdana;
}
#navmenu a:hover {
border-bottom: 1px solid #000;
padding-bottom: 2px;
color: #000;
}
#navmenu .webdesign {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin: 0;
width: 21%;
padding: 10px;
text-align: center;
float: left;
}
#navmenu .webhosting {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin: 0;
width: 21%;
padding: 10px;
text-align: center;
float: left;
}
#navmenu .overons {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin: 0;
width: 21%;
padding: 10px;
text-align: center;
float: left;
}
#navmenu .contact {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin-left: -10px;
width: 21%;
padding-top: 10px;
padding-left: 0px;
text-align: center;
float: left;
}
#body {
margin: 0;
width: 100%;
height: 600px;
}
#footer {
margin: 0;
height: 100px;
width: 100%;
color: #fff;
background: #1C1C1C;
float: left;
font-family: Verdana;
}
#logo2 {
margin-top: 48px;
margin-left: 77%;
border: 1px solid #fff;
height: 50px;
width: 22%;
}
.footer {
margin-top: 75px;
margin-left: 29%;
color: #fff;
float: left;
}
#links {
margin-top: 10px;
margin-left: 5%;
height: 80px;
width: 10%;
float: left;
}
#links a {
color: #fff;
text-decoration: none;
}
#links a:hover {
text-decoration: underline;
}
Dit is een html en een css bestand.
Maar er is een probleem:
De site ziet er anders uit als ik hem offline bekijk dan als ik hem online zet en online bekijk, weet iemand hoe dit komt?
De site heet silverworx.nl, zo ziet hij eruit op de server
Als je naar silverworx.nl/webdesign.html gaat dan zie je een foto hoe ik hem op mijn pc zie.
<html>
<head>
<title>Silverworx | Home</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="header">
<div id="logo">
</div>
<h1>
<div id="navmenu">
<ul>
<li class="webdesign"><a href="#">Webdesign</a></li>
<li class="webhosting"><a href="#">Webhosting</a></li>
<li class="overons"><a href="#">Over ons</a></li>
<li class="contact"><a href="#">Contact</a></li>
</ul>
</h1>
</div>
</div>
<div id="body">
</div>
<div id="footer">
<div id="links">
<a href="#">Webdesign</a><br>
<a href="#">Webhosting</a><br>
<a href="#">Over ons</a><br>
<a href="#">Contact</a>
</div>
<p class="footer">© Silverworx 2014</p>
<div id="logo2">
</div>
</div>
</body>
</html>
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;
}
body {
margin: 0;
}
p {
margin: 0;
}
#header {
margin: 0;
height: 60px;
width: 100%;
background: #fff;
color: #fff;
float: left;
border-bottom: 1px solid #000;
}
#logo {
margin-top: 5px;
margin-left: 15px;
height: 45px;
width: 450px;
float: left;
background: url(silverworxhome.png);
}
#navmenu {
margin-left: 52%;
margin-top: 5px;
padding: 0;
width: 47%;
height: 45px;
}
#navmenu ul {
padding: 0;
margin-top: 10px;
list-style: none;
}
#navmenu ul li a {
color: #909090;
text-decoration: none;
display: block;
font-family: Verdana;
}
#navmenu a:hover {
border-bottom: 1px solid #000;
padding-bottom: 2px;
color: #000;
}
#navmenu .webdesign {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin: 0;
width: 21%;
padding: 10px;
text-align: center;
float: left;
}
#navmenu .webhosting {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin: 0;
width: 21%;
padding: 10px;
text-align: center;
float: left;
}
#navmenu .overons {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin: 0;
width: 21%;
padding: 10px;
text-align: center;
float: left;
}
#navmenu .contact {
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
margin-left: -10px;
width: 21%;
padding-top: 10px;
padding-left: 0px;
text-align: center;
float: left;
}
#body {
margin: 0;
width: 100%;
height: 600px;
}
#footer {
margin: 0;
height: 100px;
width: 100%;
color: #fff;
background: #1C1C1C;
float: left;
font-family: Verdana;
}
#logo2 {
margin-top: 48px;
margin-left: 77%;
border: 1px solid #fff;
height: 50px;
width: 22%;
}
.footer {
margin-top: 75px;
margin-left: 29%;
color: #fff;
float: left;
}
#links {
margin-top: 10px;
margin-left: 5%;
height: 80px;
width: 10%;
float: left;
}
#links a {
color: #fff;
text-decoration: none;
}
#links a:hover {
text-decoration: underline;
}
Dit is een html en een css bestand.
Maar er is een probleem:
De site ziet er anders uit als ik hem offline bekijk dan als ik hem online zet en online bekijk, weet iemand hoe dit komt?
De site heet silverworx.nl, zo ziet hij eruit op de server
Als je naar silverworx.nl/webdesign.html gaat dan zie je een foto hoe ik hem op mijn pc zie.