[HTML/CSS]Position problems.
So I got the DIV's straight so I'm making a new "skin" on my website, but when I add the 3rd div, it wont move =S..
And well, my dad also tried briefly, but it didn't work.
So heres my source code:
Code:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- INDEX.php MINDBLASTER7.NET INDEX"-->
<head>
<title> ' Mindblaster7.net '</title>
<meta http-equiv="content-type"
content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
</head>
<body><link rel="stylesheet" type="text/css" href="css/index.css" media="screen, print" />
<div id="texting">
<font color="yellow">hehey</font>
</div>
<div id="hovedmenu">
<a href="?">Index</a><br />
<a href="?">Forum</a><br />
<a href="?">Projects</a><br />
<a href="?">Contact</a><br />
<a href="?">About</a>
</div>
<div id="fodnote">
<?php echo 'Copyright Mindblaster7.net 2008 - 2009'; ?>
</div>
</body>
</html>
and my css
[code]/* GENERELT */
body {
background: #000000;
}
/* HOVEDMENU links */
#hovedmenu a{
color: #EEEEEE; /* EEEEEEE = Hvid / 000000 = sort / ccc = gr
Re: [HTML/CSS]Position problems.
What do you mean "it wont move"? what wont move?
I know from the other thread you are just learning css (im relatively new also)
so here's some tips that helped me:
firefox addon: https://addons.mozilla.org/en-US/firefox/addon/60
Don't use <font> tags anymore, ever. Not for yellow, not for blue, nothing, do it in the css.
Try to avoid use of <br /> for example this:
Code:
<div id="hovedmenu">
<a href="?">Index</a><br />
<a href="?">Forum</a><br />
<a href="?">Projects</a><br />
<a href="?">Contact</a><br />
<a href="?">About</a>
</div>
I'd probably redo more like this
Code:
<div id="hovedmenu">
<p><a href="?">Index</a></p>
<p><a href="?">Forum</a></p>
<p><a href="?">Projects</a></p>
<p><a href="?">Contact</a></p>
<p><a href="?">About</a></p>
<div>
Also are you sure position:absolute is what you want?
Quote:
An element with position: absolute is positioned at the specified coordinates relative to its containing block. The element's position is specified with the "left", "top", "right", and "bottom" properties
I think you might need (without knowing what you are trying to do) to change your display from the default of display:block; to display:inline; perhaps.
Re: [HTML/CSS]Position problems.
When I make a layout with div, I generally make something like this:
PHP Code:
<div id="container">
<div id="header"></div>
<div id="content"></div>
<div id="bottom"></div>
</div>
and the CSS:
PHP Code:
#container{
position:relative;
float:left;
width:100%;
height:500px;
}
#header{
position:relative;
float:left;
width:100%;
height:100px;
}
#content{
position:relative;
float:left;
width:100%;
height:300px;
}
#bottom{
position:relative;
float:left;
width:100%;
height:100px;
}
Its just a fast example, but it would look like that :)
