Hej, jag är ganska ny på html och css. Jag håller på att göra en enkel hemsida. Den skall bestå av tre kolumner, en menu, header och footer (med menu).
Har byggt upp koden i min index.html så här:
*"<!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">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header">
</div>
<div id="menu">
<ul>
<li class="active"><a href="" accesskey="1" title=""> </a></li>
<li><a href="" accesskey="2" title=""> </a></li>
<li><a href="" accesskey="3" title=""> </a></li>
<li><a href="" accesskey="4" title=""> </a></li>
<li><a href="" accesskey="5" title=""> </a></li>
<li><a href="" accesskey="6" title=""> </a></li>
</ul>
</div>
<div id="content">
<div id="colOne">
</div>
<div id="colTwo">
</div>
<div id="colThree">
</div>
<div id="footer">
<ul>
<li class="active"><a href="" accesskey="1" title=""></a></li>
<li><a href="" accesskey="2" title=""></a></li>
<li><a href="" accesskey="3" title=""></a></li>
<li><a href="" accesskey="4" title=""></a></li>
<li><a href="" accesskey="5" title=""></a></li>
<li><a href="" accesskey="6" title=""></a></li>
<li><a href="" accesskey="6" title=""></a></li>
</ul>
</div>
</body>"*
Efter det så har jag lagt till en del element i de tre kolumnerna, som t. ex. headers och formulärer. För att justera en del av elementen tillhörande formulärerna så har jag använt kommandot position i .css-filen för att få dem på rätt plats.
Så här t. ex.:
#id1 "{position: absolute; left: 815px; top:500px}"
Detta såg till en början bra ut men efter att ha ändrat skärmupplösning så ändrades positionen av alla de "id" som jag gett position. Jag testade även procent istället för px med liknande resultat. Samma sak hände även när jag ändrade storlek på webbläsarfönstret efter jag försökt att få det att se bra ut utan att använda positoon.
Kan jag på något sätt komma runt detta problem eller ligger problemet i hur jag använt div-elementen kanske? Jag vill i princip ha en hemsida med header, en enkel menu, footer (med menu), tre kolumner med innehåll.
Om någon har tips hur jag kan göra detta användande min kod eller på annat sätt så är jag tacksam. Går även bra att jag gör detta genom någon template.
Tack!