Hej
Hvordan får man aside til at altid værer i toppen?
Jeg har lavet en side med en header og lige ned under en nav og der efter en article og ude i højre side er min
aside og sidst en footer.
men aside er uden i højre side, men den står ikke i toppen, kun efter header, nav og article.?
Hvordan får man aside til at altid værer i toppen
Re: Hvordan får man aside til at altid værer i toppen
Må vi se din kode? Det er meget svært at vurdere ud fra et billede.
Det ligner dog at du har alle elementerne indkapslet i samme div, eftersom der er mellemrum mellem den gule menu og footeren.
Jeg ville lave 1 div til det hele, 2 div indeni til hhv. venstre og højre side og så dine individuelle segmenter i hver af de indre divs.
Det ligner dog at du har alle elementerne indkapslet i samme div, eftersom der er mellemrum mellem den gule menu og footeren.
Jeg ville lave 1 div til det hele, 2 div indeni til hhv. venstre og højre side og så dine individuelle segmenter i hver af de indre divs.
Re: Hvordan får man aside til at altid værer i toppen
Hej.
Jeg har løst det, men du kan godt se HTML koden.
og her er så css.
Du kan se koden igennem og skrive hvis der er noget som ser mærkelige ud.
Jeg har løst det, men du kan godt se HTML koden.
Kode: Vælg alt
<!DOCTYPE HTML>
<html>
<head>
<title>Speedway</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<div id="main">
<header>
<h1>Dansk Speedway</h1>
<img src="image/topbanner700.png" width="700" height="231" alt="">
<h3>© 1995 - 2017 Update 16/2 2017</h3>
<br>
<div id="logo"><img src="runde flag/nylogods2100.png" width="100" height="100" alt=""></div>
<br>
</header>
<nav>
<ul>
<li><a href="">Home</a></li>
<li><a href="">Speedsway League </a></li>
<li><a href="">SEC</a></li>
<li><a href="">Statistik</a></li>
<li><a href="">U21 Speedway</a></li>
<li><a href="">SGP</a></li>
</ul>
</nav>
<article>
123
</article>
<aside>
<h2>Kalender Danske løb </h2>
<br>
<ul>
<li>21/4 SGP/SEC Kvalifikation Slangerup </li>
<li>6/5 SGP Kvartfinale Esbjerg</li>
<li>12/5 DM Kvartfinale Grinsted</li>
<li>25/5 DM Semifinale Glumsø</li>
<li>3/6 U21 Hold VM Semifinale Fjelsted</li>
<li>24/6 SGP Horsens</li>
<li>25/6 DM U21 Semifinale Uhre/Herning</li>
<li>29/7 DM U21 Finale Holsted</li>
<li>4/8 DM Finale Fjelsted</li>
<li>13/8 50 Års Jubilœumsløb Slangerup</li>
<li>2/9 DM Finale 85ccm Slangerup</li>
</ul>
<br>
<h2>SGP 2017</h2>
<ul>
<li>29/4 Krsko <img src="runde flag/sk28.png" width="28" height="28" alt=""></li>
<li>13/5 Warsaw <img src="runde flag/pl28.png" width="28" height="28" alt=""></li>
<li>27/5 Daugavpils <img src="runde flag/lv28.png" width="28" height="28" alt=""></li>
<li>10/6 Prag <img src="runde flag/cz28.png" width="28" height="28" alt=""></li>
<li>24/6 Horsens <img src="runde flag/dk28.png" width="28" height="28" alt=""></li>
<li>22/7 Cardiff <img src="runde flag/uk28.png" width="28" height="28" alt=""></li>
<li>12/8 Målilla <img src="runde flag/se28.png" width="28" height="28" alt=""></li>
<li>26/8 Gorzow <img src="runde flag/pl28.png" width="28" height="28" alt=""></li>
<li>9/9 Teterow <img src="runde flag/de28.png" width="28" height="28" alt=""></li>
<li>23/9 Stockholm <img src="runde flag/se28.png" width="28" height="28" alt=""></li>
<li>7/10 Torun <img src="runde flag/pl28.png" width="28" height="28" alt=""></li>
<li>28/10 Melbourne <img src="runde flag/au28.png" width="28" height="28" alt=""></li>
</ul>
</aside>
<footer>
3
</footer>
</div>
</body>
</html>
Kode: Vælg alt
body{
font-family: helvetica;
font-size: 16px;
margin: 0;
padding: 0;
background-color: #FFFFFF;
background-image:url("../image/92.jpg") ;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; }
#main {
width: 1200px;
margin: 0 auto;
}
header {
width: 60%;
background-color:#FF6633;
border:5px solid #83047A;
-moz-border-radius:43px;
-webkit-border-radius:43px;
border-radius:43px;
}
h1 {
margin: 0;
padding: 10px 0;
font: 44px "Arial";
text-align: center;
}
header h1 {
color: white;
}
#logo {
float: right;
margin-top: -100px;
padding: 15px;
}
nav{
float: left;
width: 60%;
background-color: #FF9900;
border:5px solid #83047A;
-moz-border-radius:43px;
-webkit-border-radius:43px;
border-radius:43px;
}
nav li{
float:left;
list-style: none;
}
nav li a {
float: left;
color: #000000;
padding: 6px 20px;
text-decoration: none;
border-right: 1px solid #000000;
font-size: 16px;
font-style: oblique;
}
nav li a:hover{
background-color: #333;
color:#fff;
}
article{
width: 60%;
float: left;
background-color:#FFFFFF;
border:5px solid #83047A;
-moz-border-radius:43px;
-webkit-border-radius:43px;
border-radius:43px;
}
aside{
float: right;
position: fixed;
left: 57%;
top: 0;
width: 25%;
padding-left: 5px;
background-color:#66FF00;
border:5px solid #83047A;
-moz-border-radius:43px;
-webkit-border-radius:43px;
border-radius:43px;
}
aside li{
list-style: none;
}
footer{
width: 100%;
clear: both;
background-color: #006699;
border:5px solid #83047A;
-moz-border-radius:43px;
-webkit-border-radius:43px;
border-radius:43px;
}