Gå til innhold

Trenger litt hjelp med koding


Anbefalte innlegg

Har begynt å kode fisken min, men en del problemer har begynt og dukke opp. Problemene er egentlig ganske selvforklarende, bare ta en titt her:

 

slik skal siden se ut..

 

slik ser den ut..

 

<html>
<head>
<title>Testside</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
* {
margin: 0;
padding: 0;
}

body {
 background: url(images/back.png);
 text-align:center;
}

html, body {
 height: 100%;
}

div#wrap {
 min-height: 100%;
 height: auto !important;
 height: 100%;
 background: url(images/background.png) repeat-y;
 width: 704px;
 margin: 0 auto;
 padding: 20px;
}

div#top {
 width: 704px;
 height: 151px;
 background: url(images/top.png) no-repeat;
 margin: 0 auto;
}

div#content {
min-height: 78%;
height: 78%;
padding: 0 35 0 15px;
border-left-width: 1px;
border-left-color: #B8C0D4;
margin-left: 182px;
border-left-style: solid;
text-align: left;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #999999;
line-height: 25px;
}

</style>
</head>

<body>

<div id="wrap">
<div id="top"></div>
<div id="content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur mi augue, vestibulum ac, volutpat et, viverra a, sem. Proin pellentesque nisl nec massa. Phasellus imperdiet magna vitae felis posuere scelerisque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. In imperdiet velit vel quam. Phasellus non metus ac tellus egestas vulputate. Aliquam sollicitudin dignissim ante. Maecenas luctus, orci pretium elementum eleifend, arcu dolor lacinia tellus, sit amet sollicitudin nulla lacus eget massa. Vivamus justo risus, tristique bibendum, sagittis quis, mattis vitae, nisl. Donec mauris massa, lacinia nec, egestas sed, vulputate quis, felis. Sed justo mi, tristique id, rhoncus ut, facilisis nec, elit. Curabitur laoreet, nibh sed porttitor placerat, dolor nibh consectetuer enim, sit amet nonummy orci leo ac lectus. Aenean lobortis ligula et felis rhoncus interdum.</div>
</div>

</body>
</html>

 

Problemet er altså at siden er mer enn 100% høy, slik at man må scrolle hele tiden, og at den ser forskjellig ut i IE og firefox + at siden ikke utvider seg nedover..

 

PS: Har ikke begynt med menyen enda nei;)

Endret av Tha_Zaynt
Lenke til kommentar
Videoannonse
Annonse

En liten ting til..lineheighten min er såppas stor av det ikke vises der det er paragraf (tror i hvert fall at det er det som gjør det..). Jeg prøvde å gjøre slik;

 

p {
height: 10px;
}

 

men da ble alt sammenklemt..Er det andre måter å gjøre det på?

Lenke til kommentar

Slik er koden nå..

 

<!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>
<title>Nisselink</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="wrap">
<h1>Nisselink</h1>
 <div id="content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
   Cras at lorem. Praesent aliquam dictum odio. Maecenas id lorem. Suspendisse 
   massa urna, tempor nec, euismod non, laoreet et, lacus. Etiam imperdiet sapien 
   id lectus. Nam tincidunt, urna at pretium condimentum, odio erat volutpat 
   justo, et luctus pede enim in risus. Sed dignissim. Mauris aliquam magna imperdiet 
   justo. Aenean a felis. Nunc lorem magna, volutpat bibendum, iaculis eu, euismod 
   eget, tortor. Nulla nisl.
   <p>Curabitur at odio. Donec est. Praesent molestie cursus quam. Sed luctus. 
     Nullam id lorem. Curabitur eget magna vel nibh faucibus placerat. Donec 
     aliquam. Mauris dapibus nibh ut augue. Integer cursus sagittis sapien. Sed 
     condimentum tristique enim. Sed a turpis. Nulla fringilla. Fusce aliquam 
     rutrum orci. Maecenas gravida elementum magna. Aenean porta vehicula leo. 
     Aliquam erat volutpat. Integer ut nisl. Donec ultricies massa eu quam.</p>
   <p>Donec libero. Ut malesuada. Praesent lobortis arcu sit amet est. Nullam 
     nec eros. Cras pretium congue ligula. Suspendisse adipiscing pulvinar augue. 
     Nulla ac sapien eu quam iaculis porttitor. Aliquam quis risus. Suspendisse 
     nec nibh vitae felis faucibus suscipit. Nullam vitae ante. Nulla neque wisi, 
     vulputate sit amet, ultrices nec, hendrerit a, lectus. Nunc gravida est 
     ut libero. Class aptent taciti sociosqu ad litora torquent per conubia nostra, 
     per inceptos hymenaeos.</p>
   <p>Pellentesque nec tortor id justo egestas pharetra. Sed eget magna. Cras 
     quis nulla vitae augue convallis consectetuer. Nulla vitae neque id neque 
     tincidunt ultrices. Integer sit amet augue sit amet erat sollicitudin ornare. 
     Nunc gravida convallis quam. Sed consequat volutpat leo. Suspendisse porta. 
     Donec arcu lorem, rutrum eget, suscipit ut, convallis semper, urna. Morbi 
     euismod egestas odio. Vestibulum ante ipsum primis in faucibus orci luctus 
     et ultrices posuere cubilia Curae; Pellentesque vitae lorem. Mauris erat. 
     Suspendisse posuere euismod eros. Quisque blandit ullamcorper tellus. Vivamus 
     lorem metus, eleifend cursus, blandit vel, consequat sed, justo. Etiam malesuada 
     risus egestas neque. Fusce sem velit, feugiat ac, ullamcorper vitae, gravida 
     cursus, odio. Suspendisse ligula metus, condimentum nec, dignissim at, placerat 
     sed, magna. Pellentesque habitant morbi tristique senectus et netus et malesuada 
     fames ac turpis egestas.<br />
   </p>
 </div>
</div>
</body>
</html>

 

 

css

* {
margin: 0;
padding: 0;
}

body {
 background: url(images/back.png);
 text-align:center;
}

html, body {
 height: 100%;
}

div#wrap {
 min-height: 100%;
 height: auto !important;
 height: 100%;
 background: url(images/background.png) repeat-y;
 width: 704px;
 margin: 0 auto;
 padding: 20px 20px 0 20px;
}

h1 {
 width: 704px;
 height: 151px;
 background: url(images/top.png) no-repeat;
 margin: 0 auto;
 text-indent: -9999px;
 font-size: 1px;
}

div#content {
min-height: 50%;
height: 50%;
padding: 0 35px 10px 20px;
border-left-width: 1px;
border-left-color: #B8C0D4;
margin-left: 182px;
border-left-style: solid;
text-align: left;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 14px;
color: #999999;
line-height: 170%;
}

 

Noen som har en forklaring på hvorfor paragrafene mine ikke vises?

 

for demo se her

Endret av Tha_Zaynt
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
×
×
  • Opprett ny...