Avatar billede sannathorium Nybegynder
29. september 2011 - 21:00 Der er 15 kommentarer og
1 løsning

Problem med baggrundsbillede der flytter sig i mellem to sider...

Hej,

jeg er rimelig ny i html og css. Jeg har et problem med at mit baggrundsbillede på min hjemmeside flytter sig når jeg bevæger mig mellem to sider. Den første side "hjem" har større boks og mere tekst, derfor har den også en scroll bar. Men side to har mindre tekst og ingen scroll bar og derfor rykker sig bagrundsbilledet lidt (så man ser mere af det). Hvad kan jeg gøre for at ændre på dette?

På forhånd tak!;-)
Avatar billede majbom Novice
29. september 2011 - 21:06 #1
du kan starte med at smide et link til siden...
Avatar billede gadensgaard Nybegynder
29. september 2011 - 21:20 #2
Det vil være en del nemmere at hjælpe dig hvis du lige smider er link til din hjemmeside.
Avatar billede gadensgaard Nybegynder
29. september 2011 - 21:21 #3
Øh, jeg ved ikke hvorfor splazz' kommentar ikke blev vist da jeg åbnede spørgsmålet. Beklager at jeg postede en "what he said".
Avatar billede majbom Novice
29. september 2011 - 21:34 #4
-> #3 - det er eksperten i en nøddeskal... SUK!
Avatar billede sannathorium Nybegynder
30. september 2011 - 12:31 #5
Eh...hjemmesiden er ikke oppe, men jeg sender lige html og css koden....På forhånd tak!

Side 1:
<!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 name="author" content="Magnus och Johannes" />
<meta name="date" content="2010-09-15" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Jätteekorrar</title>
<link rel="stylesheet" href="css/bas.css" type="text/css" media="screen" />
</head>
<body>
<div id="left">
  <img src="/bilder/guar.jpg" alt="backgroundsimage" />
</div>
<div id="container">
  <img src="bilder/header.png" alt="Squirrel web page" />
  <div id="mainContent">
    <div id="menu">
      <a href="index.html">Hem</a> • <a href="kalla.html">Källor</a> • <a href="http://sv.wikipedia.org/wiki/Jätteekorrar">Vad säger Wikipedia?</a>
    </div>
    <h1>Jätteekorre</h1>
    <p><img src="bilder/ekorre.jpg"  style="float:right" alt="Squirrel" />Jätteekorrar (Ratufa) är ett släkte i ekorrfamiljen som förekommer i södra Asien. Med en kroppslängd av 25 till 45 centimeter är några individer större än ett mårddjur. Vikten ligger vanligtvis vid 2 kilogram men vissa exemplar blir 3 kilogram tunga. Trots namnet är de inte störst i familjen. I gruppen flygekorrar finns ännu större djur.
Släktet består av fyra arter:</p>
    <ul>
      <li><b><i>Ratufa macroura</i></b>, södra Indien och Sri Lanka.</li>
      <li><b><i>Ratufa indica</i></b>, Indien.</li>
      <li><b><i>Ratufa bicolor</i></b>, på det sydöstasiatiska fastlandet samt på Hainan, Sumatra, Java och Bali.</li>
      <li><b><i>Ratufa affinis</i></b>, Malackahalvön, Sumatra, Borneo.</li>
    </ul>
    <hr />
    <h2>Kännetecken</h2>
    <p>Arterna har en färgglad mönstring på pälsen. Till exempel har Ratufa bicolor en svart ovansida och en gulaktig undersida. Ratufa indica har en mörkröd grundfärg, svarta fläckar på ryggen, skuldrorna och extremiteterna samt en gulvit undersida. Fötterna är kraftigt utvecklade och försedda med klor.</p>
    <hr />
    <h2>Levnadsätt</h2>
    <p>Jätteekorrar lever i trädkronor i regnskogen. Där hoppar de ibland över 6 meter från gren till gren. De vilar i trädens håligheter och bara för att föda upp sina ungar bygger de ett bo i trädet. Dessa bon är mycket stora med en diameter upp till 2 meter.</p>
<p>Födan utgörs som hos de flesta ekorrar av nötter, frukter och bark samt i mindre skala av fågelägg. I motsats till de flesta andra ekorrar saknar jätteekorrar förmåga att sitta på de bakre extremiteterna och hålla jämvikt.</p>
<p>Varje individ lever ensam utanför parningstiden. Efter dräktigheten som varar i cirka 30 dagar föder honan ett till fem ungdjur. Dessa blir könsmogna först efter två år. Enskilda exemplar i fångenskap blev 20 år gamla - som är påfallande lång tid för gnagare.</p>
    <img src="bilder/giant.jpg" alt="Långsvansad ekorre"/><br />
    <p >Långsvansad jätteekorre, lever i Sydamerika</p>

    <hr />
    <h2>Hot</h2>
    <p>IUCN listar Ratufa indica och Ratufa macroura som sårbar (vulnerable). Den sistnämnda arten hade en större population i södra Indien men dessa djur är med undantag av några få exemplar utdöda och så finns bara på Sri Lanka ett större bestånd. Av Ratufa indicas fyra beskrivna underarter är Ratufa indica dealbata utdöd. Den levde i delstaten Gujarat men sedan 1940-talet iakttas inga individer.
    </p>
    <hr style="margin-bottom:30px"/>
    <img src="bilder/actionfigs.jpg" alt="Nedgjord ekorre" />
    <p style="margin-bottom:100px">Nedgjord jätteekorre av soldaterna Joe och Jim</p>
   
</div>
</div><!--End Container-->
<div id="right">
  <img src="bilder/guar.jpg" alt="backgroundsimage"/>
</div>
</body>
</html>

Side 2:
<!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>Jätteekorrar</title>
<link rel="stylesheet" href="css/bas.css" type="text/css" media="screen" />
</head>

<body>
<div id="left">
  <img src="bilder/guar.jpg" alt="backgroundimage" />
  </div>
<div id="container">
  <img src="bilder/header.png" alt="Squirrel web page" />
  <div id="mainContent">
    <div id="menu">
      <a href="index.html">Hem</a> • <a href="kalla.html">Källor</a> • <a href="http://sv.wikipedia.org/wiki/Jätteekorrar" target="_blank">Vad säger Wikipedia?</a></div>
ikipedia?</a></div>
    <h1>Källor</h1>
    <ul>
        <li>Ronald M. Nowak: Walker's Mammals of the World. Johns Hopkins University Press, 1999 ISBN 0801857899</li>
        <li>Michael D. Carleton, Guy G. Musser: Order Rodentia. In: Don E. Wilson, DeeAnn M. Reeder (utgivare): Mammal Species of the      World. 3 upplaga. Johns Hopkins University Press, Baltimore 2005, S. 745-1600, ISBN 0-8018-8221-4.</li>
    </ul> 
</div>
</div>
<!--End Container-->
<div id="right">
  <img src="bilder/guar.jpg" alt="backgroundimage" />
</div>
</body>
</html>

Css:
@charset "UTF-8";
/* CSS Document */
html, body {
    height:100%;
}
body {
    font: Verdana, Geneva, sans-serif ;
    margin: 0px;
    padding: 0px;
    text-align: center;
    color: #000;
    height:100%;
    background-color:#000;
}
#left {
    height:100%;
    position: absolute;
    left:0px;
    z-index:1;
   
}
#right {
    height:100%;
    float:right;
    position:absolute;
    right:0px;
    top:0;
    z-index:2;
}
a {
    color: #300;
    font-family: Verdana, Geneva, sans-serif;
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
    color:#999;
}
a:visited {
    color:#300;
}
p {
    font-family: Verdana, Geneva, sans-serif;
}
h1 {
    color: #422305;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight:100;
}
li {
    font-family: Verdana, Geneva, sans-serif;
}
h2 {
    color: #422305;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight:100;
}
#container {
    width: 720px;
    background:#FFF;
    text-align: left;
    position:relative;
    z-index:99;
}

#mainContent {
    padding: 0 20px 20px;
    background:#FFF;
}

hr {
    color:#000000;
    width: 95%;
    border-style:solid;
    border-width: 1px;
   
}
#menu {
    margin-top:10px;
}
Avatar billede gadensgaard Nybegynder
30. september 2011 - 12:39 #6
Øhh, du bruger jo slet ikke baggrundsbilledet i din CSS? Er der en speciel grund til at du har sat billedet ind som HTML element?

Jeg kan ikke helt tolke ud fra din HTML og CSS hvad det er du forsøger at opnå.
Avatar billede sannathorium Nybegynder
30. september 2011 - 13:21 #7
Nej, det er det ikke.... Hvordan kan jeg påvirke det i css? Jeg er helt på bar bund, som sagt meget ny på området. Det er ligesom  at når scrollbaren forsvinder på side 2, så flytter sig dette billede <img src="bilder/guar.jpg" alt="backgroundimage" />. Ja, jeg ved ikke helt hvordan jeg skal beskrive det på en anden måde, men det er det der sker og det er temmelig irriterende for øjet....

Tak!;-)
Avatar billede gadensgaard Nybegynder
30. september 2011 - 13:32 #8
Du kan styre baggrundsbillede via css fx:

#left {
background:url(../bilder/guar.jpg) center top no-repeat;
}

Du kan også tvinge scrollbar på alle sider, det løser problemet med at den hopper:

body {
overflow-y: scroll;
}
Avatar billede sannathorium Nybegynder
30. september 2011 - 13:44 #9
Super, tak!!!
Avatar billede gadensgaard Nybegynder
30. september 2011 - 13:45 #10
Hvis det løste dit problem smider jeg lige et svar.
Avatar billede sannathorium Nybegynder
30. september 2011 - 13:47 #11
At lave en Scrollbar virkede!
Avatar billede mik28 Seniormester
01. oktober 2011 - 12:56 #12
Jeg kan ikke få lov til at acceptere svaret :-(
Avatar billede keysersoze Guru
01. oktober 2011 - 13:54 #13
måske fordi det ikke er dig der har oprettet spørgsmålet? dobbeltbruger?
Avatar billede mik28 Seniormester
01. oktober 2011 - 14:21 #14
Bestemt ikke dobbeltbruger.
Avatar billede keysersoze Guru
01. oktober 2011 - 14:36 #15
Hvorfor er du så i tvivl om hvorfor du ikke kan lukke et spm der ikke er dit?
Avatar billede majbom Novice
01. oktober 2011 - 16:15 #16
haha!
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester