Hej!
Jeg kan godt finde ud af at centrere tekst og alt det der gejl
men satma ja så vil linkende sku' irretere.
Jeg har det her lille prøve forum hvor jeg i link boxen gerne
ville havde det til at stå i midten jeg er midlertidig nødt til
at bruge padding left/right men efter det ikke er super præcist
og hele tiden skal rette det efter hvor mange link jeg får ville
jeg gerne havde centreret det så det ikke er så svært at holde
styr på
her er HTML delen(unskyld der roder lidt i min kodning håber i
kan finde rundt i det :P):
<html>
<head>
<title>Test-Forum</title>
<link rel="stylesheet" type="text/css" href="style/style.css">
<body>
<div id="top">
Dette er et test-forum
</div>
//her starter link-baren
<div id="link-bar">
<div class="link">
<a href="#">Forside</a>
</div>
<div class="mellemrum">h
</div>
<div class="link">
<a href="#">Galleri</a>
</div>
<div class="mellemrum">h
</div>
<div class="link">
<a href="#">Forum</a>
</div>
</div>
//her slutter link-baren
<div id="alt">
<div id="nyeste-traade">
<div id="overskrift3">
Nyeste tråde
</div>
<br />
<br />
<br />
<div class="text">
<div class="link">
<a href="#">NYESTE(bilka 20 år)</a>
</div>
</div>
<br />
<div class="text">
<div class="link">
<a href="#">wc3 tunering tot vinder</a>
<br />
</div>
</div>
<div class="text">
<div class="link">
<a href="#">blablabla</a>
</div>
</div>
</div>
<div id="overskrift">
Forum:
</div>
<div id="se-traad-text">
<a href="se-traad.php">se alle nyeste tråde</a>
</div>
<div id="forum_context">
<div id="forum_text">
<div class="text">
Velkommen til forummet, det er ikke oppe indnu
fordi.......... =)=)=)=)=)=)
</div>
</div>
<br />
<br />
<br />
<div id="overskrifter">
<div class="text">
<a href="se-traad.php">Fest</a>
</div>
<div class="opret-traad">
<a href="opret-traad.php">Opret tråd</a>
</div>
<div class="understreg">f
</div>
<div class="text">
<a href="se-traad.php">Ballade</a>
</div>
<div class="opret-traad">
<a href="opret-traad.php">Opret tråd</a>
</div>
<div class="understreg">f
</div>
<div class="text">
<a href="se-traad.php">Skole</a>
</div>
<div class="opret-traad">
<a href="opret-traad.php">Opret tråd</a>
</div>
<div class="understreg">f
</div>
<div class="text">
<a href="se-traad.php">Lort</a>
</div>
<div class="opret-traad">
<a href="opret-traad.php">Opret tråd</a>
</div>
<div class="understreg">f
</div>
<div class="text">
<a href="se-traad.php">Lorte lort</a>
</div>
<div class="opret-traad">
<a href="opret-traad.php">Opret tråd</a>
</div>
</div>
</div>
</div>
</body>
</head>
</html>
Her er css delen:
#top {
height: 80px;
width: 900px;
border: 1px solid;
border-bottom: none;
margin:auto;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 10px;
font-size: 50px;
}
#forum-sider {
width: 900px;
border: 1px solid;
text-align: center;
margin:auto;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 10px;
}
#alt {
width: 910px;
height: 700px;
border: 1px solid;
text-align: center;
margin:auto;
padding-top: 10px;
padding-left: 10px;
padding-bottom: 10px;
}
#overskrift {
font-size: 30px;
padding-top: 100px;
padding-right: 150px;
}
#forum_context {
width: 100%;
}
#forum_text {
border: 1px solid #000000;
width: 250px;
height: 150px;
margin:auto;
}
..text {
float: left;
}
#overskrifter {
width: 400px;
height: 100px;
margin:auto;
border: 1px solid #000000;
}
..opret-traad {
float: right;
text-align: right;
}
..understreg {
color: #ffffff;
border-bottom: 1px solid #000000;
}
a {
color: blue;
text-decoration:none;
}
#traad {
height: 600px;
width: 400px;
border: 1px solid;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 10px;
}
#kommentare {
height: 300px;
width: 300px;
border: 1px solid;
}
#overskrift2 {
font-size: 30px;
float: left;
}
#nyeste-traade {
height: 500px;
width: 150px;
border: 1px solid;
float: left;
}
#overskrift3 {
font-size: 20px;
float: left;
}
#traad-box {
border: 1px solid #000000;
width: 300px;
height: 670px;
margin:auto;
}
#se-traad {
float: right;
width: 100px;
height: 20px;
border: 1px solid;
border-right: none;
}
#se-traad-text {
float: right;
text-decoration: underline;
text-decoration: overline;
border-left: 1px solid;
height: 20px;
border-bottom: 1px solid;
}
..link {
color: blue;
text-decoration: underline;
float: left;
margin:auto;
}
#overskrift4 {
font-size: 30px;
padding-top: 60px;
}
#link-bar {
margin:auto;
float: middle;
width: 520px;
height: 20px;
border: 1px solid #000000;
color: blue;
border-bottom: none;
padding-left: 400px; //padding delen som midlertidig for
det til at blive centreret men ikke er præcist
}
..mellemrum {
color: white;
float: left;
}
På forhånd tak :P
- Jonathan
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! =>
http://www.html.dk/tutorials