fersking vil få templates til å holde fast bredde....

eLang · 13. februar 2009

Hei. Er ganske fersk når det gjelder html/webdesign, men jeg har funnet en templates jeg vil

bruke. Men problemet er at den ikke helt oppfører seg som jeg vil den skal gjøre.

Jeg vil at den skal holde en fast bredde på for eksempel 800 px slik at ting

ikke forskyver seg når man gjør browser vinduet mindre/lavere oppløsning etc...

Må si at jeg satt i hele går kveld og prøvde å få det til uten hell...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<meta name="description" content="description"/>
<meta name="keywords" content="keywords"/> 
<meta name="author" content="author"/> 
<link rel="stylesheet" type="text/css" href="default.css" media="screen"/>
<title>Shades of Gray</title>
</head>

<!-- default margin = default layout -->
<body style="margin: 0 12%;">

<div class="container">

<div class="header">
	<a href="index.html"><span>Shades of Gray</span></a>
</div>

<div class="stripes"><span></span></div>

<div class="nav">
	<a href="index.html">Default layout</a>
	<a href="index2.html">Wide layout</a>
	<a href="index3.html">Thin layout</a>
	<a href="index.html">consequat</a>
	<a href="index.html">sem justo</a>
	<div class="clearer"><span></span></div>
</div>

<div class="stripes"><span></span></div>

<div class="main">

	<div class="left">

		<div class="content">

			<h1>Porttitor posuere</h1>
			<div class="descr">Jun 13, 2006 by Vulputate</div>

			<p>In hac habitasse platea dictumst. Duis porttitor. Sed vulputate elementum nisl. Vivamus et mi at arcu mattis iaculis. <a href="index.html">Nunc eget pretium</a> diam. Pellentesque dictum faucibus leo. Vestibulum ac ante. Sed in est.</p>

			<blockquote><p>Sed sodales nisl sit amet augue. Donec ultrices, augue ullamcorper posuere laoreet, turpis massa tristique justo, sed egestas metus magna sed purus.</p></blockquote>

			<p>Fusce porta pede nec eros. Maecenas ipsum sem, interdum non, aliquam vitae, interdum nec, metus. Maecenas ornare lobortis risus. Etiam placerat varius mauris. Maecenas viverra. Sed feugiat. Donec mattis <a href="index.html">quam aliquam</a> risus. Proin quis massa semper felis euismod ultricies.</p>

			<h1>Adipiscing</h1>
			<div class="descr">Jun 11, 2006 by Laoreet</div>

			<p>Venenatis ac ante fusce accumsan enim et arcu. Duis sagittis libero at lacus. Suspendisse lacinia nulla eget urna.</p>

			<ul>
				<li>Tristique</li>
				<li>Aenean</li>
				<li>Pretium</li>
			</ul>

			<p>In hac habitasse platea dictumst. Duis porttitor. Sed vulputate elementum nisl. Vivamus et mi at arcu mattis iaculis. Fusce eleifend, dui ut posuere auctor, justo elit posuere sapien, at blandit enim quam fringilla mi.</p>

			<h1>Interdum</h1>
			<div class="descr">May 24, 2006 by Lectus</div>

			<p>Praesent nisi sem, bibendum in, ultrices sit amet, euismod sit amet, dui. Fusce nibh. Curabitur pellentesque, lectus at <a href="index.html">volutpat interdum</a>. Pellentesque a nibh quis nunc volutpat aliquam</p>

			<code>margin-bottom: 12px;
font-size: 1.1em;
background: url(img/quote.gif);
padding-left: 28px;
color: #555;</code>

			<p>Eget feugiat est leo tempor quam. Ut quis neque convallis magna consequat molestie.</p>

		</div>

	</div>

	<div class="right">

		<div class="subnav">

			<h1>Auctor</h1>
			<p>In hac habitasse platea dictumst. Duis auctor. Sed vulputate elementum nisl. Vivamus et mi at arcu mattis iaculis. Fusce eleifend, dui ut posuere auctor, justo elit posuere sapien.</p>

			<h1>Duis Elit</h1>
			<ul>
				<li><a href="index.html">consequat molestie</a></li>
				<li><a href="index.html">sem justo</a></li>
				<li><a href="index.html">semper</a></li>
				<li><a href="index.html">magna sed purus</a></li>
			</ul>

			<h1>Sapien</h1>
			<ul>
				<li><a href="index.html">sociis natoque</a></li>
				<li><a href="index.html">magna sed purus</a></li>
				<li><a href="index.html">tincidunt</a></li>
			</ul>

			<h1>Blandit Enim</h1>
			<ul>
				<li><a href="index.html">consequat molestie</a></li>
				<li><a href="index.html">sem justo</a></li>
				<li><a href="index.html">semper</a></li>
				<li><a href="index.html">magna sed purus</a></li>
			</ul>

			<h1>Fringilla</h1>
			<ul>
				<li><a href="index.html">sociis natoque</a></li>
				<li><a href="index.html">magna sed purus</a></li>
				<li><a href="index.html">tincidunt</a></li>
			</ul>

		</div>

	</div>

	<div class="clearer"><span></span></div>

</div>

<div class="footer">

		<div class="col3">

			<h2>Tincidunt</h2>
			<ul>
				<li><a href="index.html">consequat molestie</a></li>
				<li><a href="index.html">sem justo</a></li>
				<li><a href="index.html">semper</a></li>
				<li><a href="index.html">magna sed purus</a></li>
				<li><a href="index.html">tincidunt</a></li>
			</ul>

		</div>

		<div class="col3center">
			<h2>Sed purus</h2>
			<ul>
				<li><a href="index.html">consequat molestie</a></li>
				<li><a href="index.html">sem justo</a></li>
				<li><a href="index.html">semper</a></li>
				<li><a href="index.html">magna sed purus</a></li>
				<li><a href="index.html">tincidunt</a></li>
			</ul>
		</div>

		<div class="col3">
			<h2>Praesent</h2>
			<ul>
				<li><a href="index.html">consequat molestie</a></li>
				<li><a href="index.html">sem justo</a></li>
				<li><a href="index.html">semper</a></li>
				<li><a href="index.html">magna sed purus</a></li>
				<li><a href="index.html">tincidunt</a></li>
			</ul>
		</div>

		<div class="bottom">

			<span class="left">© 2006 <a href="index.html">Website.com</a>. Valid <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> & <a href="http://validator.w3.org/check?uri=referer">XHTML</a>.</span>
			<span class="right">Template design by <a href="http://arcsin.se">Arcsin</a></span>

			<div class="clearer"><span></span></div>

		</div>

</div>

</div>

</body>

</html>

Endret 13. februar 2009 av eLang

Kultom · 13. februar 2009

Litt lat av meg, men sitter i timen og bare tenkte jeg skulle gi et tips som kanskje funker hvertfall, selv om jeg ikke leste hele inlegget.

I stylesheeten din legg til:

body {

margin-left:auto; /* Disse to er for å midstille siden, om det er ønskelig */

margin-right:auto;

min-width:800px;

max-width:800px;

}

Endret 13. februar 2009 av kvitrafn

eLang · 13. februar 2009

Funker som f. Tusen takk for hjelpen kvitrafn... :yes:

Prøvde noe lignende i går, men gjorde det tydligvis ikke helt riktig.

Logg inn

fersking vil få templates til å holde fast bredde....

Anbefalte innlegg

eLang

Lenke til kommentar

Videoannonse

Kultom

Lenke til kommentar

eLang

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer