Avatar billede drinkit Praktikant
08. april 2009 - 11:39 Der er 8 kommentarer og
1 løsning

Div skal have 20px afstand fra bottom MED scroll

http://www.xup.dk

Som I kan se går min "indholds" div helt ned til bunden.
Jeg har prøvet at give den margin-bottom: 20px; uden held.
jeg har også givet min body padding-bottom: 20px;
og jeg har prøvet at sætte position - botton: 20px på diven.. (Men så kan man ikke scrolle browseren som nu, så skal man scrolle div'en, hvilket jeg ik ønsker.

css: www.xup.dk/style.css

Håber I kan hjælpe.

Vh. og God påske, Mikael
Avatar billede mall Nybegynder
08. april 2009 - 12:20 #1
Prøv at fjern:
html {
    height: 100%;
}
Avatar billede drinkit Praktikant
08. april 2009 - 13:06 #2
har prøvet.. gør ingen forskel! hmm
Avatar billede notes2c Nybegynder
08. april 2009 - 18:22 #3
Hvorfor skal spalte 1 & 2 være position absolute, Det er der ingen grund til.

Det her er vel det du ønsker:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<title>XUP.DK - BLOG OM EVENTS I KØBENHAVN</title>
<base href="http://www.xup.dk/">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="Description" content="En blog om events: fester, koncerter og receptioner i København! Lokationer: Stengade, Rust, JazzHouse, Vega, Jolene, Kødboderne, Dunkel, Flying a, Nag people, Pede og Stoffer, Kyoto og mange flere..">
<meta name="Keywords" content="events i københavn, fester i københavn">

<link rel="stylesheet" type="text/css" href="style.css">

<script src="xup.js" type="text/javascript"></script>
<style type="text/css">
#spalte1 {
position:static;
float:left;
}
#spalte2 {
position:static;
float:left;
margin-left: 10px;
margin-bottom: 20px;
}
</style>
</head>

<body onload="xup();">

<div id="logo" onclick="location.href='index.php';" onmouseover="xup('GENINDLÆS XUP.DK');" onmouseout="xup();">XUP.DK</div>

<div id="spalte1">
<p class="menu" onClick="window.location.href='?side=forside'" onmouseover="xup('NYHEDER & EVENTS BLOG');" onmouseout="xup();"><b>»</b> <a href="?side=forside">Forside</a></p>
<p class="menu" onClick="window.location.href='?side=links'" onmouseover="xup('MINE FAVORIT SIDER PÅ NETTET');" onmouseout="xup();"><b>»</b> <a href="?side=links">Favorit links</a></p>

<p class="menu" onClick="window.location.href='?side=billeder'" onmouseover="xup('BILLEDGALLERI FRA FORSKELLIGE EVENTS');" onmouseout="xup();"><b>»</b> <a href="?side=billeder">Billeder</a></p></div>

<div id="spalte2">
<p class="overskrift">NYHEDER & EVENTS BLOG</p>
<br>

<div class="nbilledebox"><a href="gfx/nyheder/tuborg.jpg"><img class="nbillede" src="gfx/nyheder/tuborg.jpg" alt=""></a></div>
<div class="nbilledetekst">
<b>Style.dk reception</b>

<p class="dato">8. april 2009</p>
<p><a href="gfx/nyheder/style.jpg"><img class="billeder1" src="gfx/nyheder/style.jpg" alt=""></a><br>Tryk på billedet for at se den fulde flyer!</p>
</div>

<div class="nbilledebox"><a href="gfx/nyheder/easter.jpg"><img class="nbillede" src="gfx/nyheder/easter.jpg" alt=""></a></div>
<div class="nbilledetekst">
<b>Påskeferiens events</b>
<p class="dato">7. april 2009</p>
<p>NIGHTOLOGY (det gamle ENVY koncept) holder 4-års fødselsdag i aften kl. 23:00 på <a href="http://www.dansebaren.dk">dansebaren</a>.<br>
Line up: <a href="http://en.wikipedia.org/wiki/Rune_RK">Rune RK</a>, <a href="http://www.myspace.com/mortenbreum">Morten Breum</a> og Sorte Slyngel..<br>

Prisen er ikke opgivet, men for gæsteliste sms på tlf. 51515148.</p>
<p>I morgen åbner dørene til det nye fest-koncept "WE ARE" (By <a href="http://www.aok.dk/natteliv/i-am">I AM</a>) på <a href="http://www.nasa.dk">NASA</a> kl. 23:00 - Gæsteliste: <a href="mailto:info@nimak.dk">info@nimak.dk</a><br>
Line up:<br><a href="http://www.myspace.com/medinasoulcamp">MEDINA</a> (LIVE), THOMAS MADVIG, SORTE SLYNGEL, SAMI KID og MR. MØLLER</p>
<p>Torsdag d. 9. april er der <a href="http://www.popcph.dk">POP cph</a> udsalg på <a href="http://www.hotelfox.dk">Hotel Fox</a>, fra kl. 11-17) <br>- senere er fest i <a href="http://www.kulturrum.dk/hal-d.php">Hal D</a> "KYLLE RYLLE KNALD" med ret nice djs: <a href="http://www.myspace.com/krazybillybilly">BILLY Soundsystem</a>, <a href="http://www.camillejones.com">Camille Jones</a> vs. Ollervaje, <a href="http://www.myspace.com/djdjunabarnes">Djuna Barnes</a>, De'To, Rick Shane og MadMax vs. David Lange!<br>

Gratis entre fra 22:00 - 23:00 + 1 Tuborg Påske Bryg.</p>
<p>Fredag d. 10. april starter danseprivaten op igen med ny lokation:<br>På hjørnet af Pile Alle og Vesterbrogade - CAFE PLATFORM!<br>
Det bliver hyggeligt! Men hvis man hellere vil rave end at snakke, så tag på kødboderne!</p>
<p>Lørdag d. 11. april er der Turboklub på favorit stedet PAN.<br>
Line up omfatter bla. MHM ONE fra Tartelet records & <a href="http://www.myspace.com/ungflugt">UNG FLUGT</a>!<br>
Festen starter kl. 23:00 og koster 60 kr.<br>
Hvis det ikke liiiige er noget, så tag på kødboderne til SELECTOR SUPERIOR!</p>

<p>God påske!</p>
</div>


<div class="nbilledebox"><a href="gfx/nyheder/pop.jpg"><img class="nbillede" src="gfx/nyheder/pop.jpg" alt=""></a></div>
<div class="nbilledetekst">
<b>POP Maskebal</b>
<p class="dato">2. april 2009</p>
<p>På fredag holder <a href="http://www.popcph.dk">POP (Mikkel og Kasper)</a> 4 års fødselsdag.<br>
Stedet hedder A. C. Glob og ligger på Store Kongensgade 60, og der er tale om et maskebal.</p>

<p><i>Dear Montagues & Capulets, Marie Antoinettes & Musketeers.
Keep your eyes wide shut and get lost in a Masquerade...</i></p>
<p>Prisen er 100 kr. i døren, og festen starter kl. 23!<br>
For liste (som er nødvendigt for at komme ind) skriv til:<br>
<a href="mailto:info@popcph.dk ">info@popcph.dk</a></p>
</div>

<div class="nbilledebox"><a href="gfx/nyheder/hangover.jpg"><img class="nbillede" src="gfx/nyheder/hangover.jpg" alt=""></a></div>
<div class="nbilledetekst">
<b>Det var den weekend!</b>
<p class="dato">29. marts 2009</p>

<p>Så blev det søndag.<br>
Igår var vi til Save Izabela støttefesten i Huset, som alle dage har været en fed location. Festen tog sig også godt ud, selvom vi var nødt til at smutte ved 2 tiden (vi var så trætte efter fredag!).<br>
Der var gang i dansegulvet med glade, udklædte homoer og flotte, velklædte piger - med trentemøller i alternativt humør, og kun ét minuts musik-svigt.<br>
God fest, så længe den varede for mig.<p>
Fredag var vi på Arkitektskolen, hvor der også var knald på rock'en fra 60'erne og 70'erne. Der var ikke så mange mennesker, men stemningen var behagelig, og mange folk greb chancen til at få networked lidt med nye ansigter.</p>
</div>

<div class="nbilledebox"><a href="gfx/nyheder/2manydjs.jpg"><img class="nbillede" src="gfx/nyheder/2manydjs.jpg" alt=""></a></div>
<div class="nbilledetekst">
<b>Koncert: 2 Many DJs på RUST</b>
<p class="dato">24. marts 2009</p>

<p><b style="color: red;">KONCERT AFLYST(RYKKET) PGA. SYGDOM. <a href="http://www.rust.dk/pages/nyheder.php?id=137">Mere info</a></b></p>
<p>De 2 legendariske DJs, Da Stephen og Dave Dewaele, fra Belgien, indtager <a href="http://www.rust.dk">RUST</a> på fredag, d. 27. marts.<br>
De er tidligere medlemmer af bandet <a href="http://www.myspace.com/soulwax">SOULWAX</a>, som havde stor success en del år tilbage. Hvis du er til elektro/rock/techno i stor stil, så er det en sikker vinder!</p>
<p>Pris: 250 kr (+ gebyr) <a href="http://www.billetlugen.dk/musik/7460/">her</a>.</p>
</div>

<div class="nbilledebox"><p><a href="gfx/nyheder/abefest.jpg"><img class="nbillede" src="gfx/nyheder/abefest.jpg" alt=""></a></p></div>
<div class="nbilledetekst">
<b>Weekendens events</b>
<p class="dato">23. marts 2009</p>
<p>I den kommende weekend (27. og 28. Marts) er der 3 fede, og vidt forskellige fester i København.</p>
<p>Fredag byder på stor Abe-fest på <a href="http://www.karch.dk">Arkitektskolen, holmen</a> (60 kr i døren og billig bar). Festen starter kl 20.00 med X-Factor finale på storskærm. Senere går <a href="http://www.myspace.com/soulsystemet">Soulsystemet</a> fra POLKA på og fylder kantinen med gode rytmer til solen står op!</p>

<p>
Lørdag er der "IZABELA - Støttefest i <a href="http://www.husetmagstraede.dk">Huset i magstræde</a>", en fest hvor alt overskud går ubeskåret til behandling af Izabela Sokolowska (kongelig balletdanser og mor til 9 mdr. gamle Parys)'s kræft.<br>
Af DJs kan bla. nævnes <a href="http://www.myspace.com/trentemoeller">Trentemøller</a>, Thomas Madvig og Atle Thorberg.
Det koster 80 kr. og starter kl. 21:00.</p>
<p>Hvis man er fra Nørrebro og ikke orker at tage hele vejen ind til Huset i magstræde, så er der et alternativ.<br>
<a href="http://www.stengade30.dk">Stengade30</a> har den seneste tid fået et gevaldigt ansigtsløft i image og koncept. Arrangementet <a href="http://www.facebook.com/home.php#/event.php?eid=57009150278">PLAY WITH US</a> bliver skudt af stablen lørdag kl. 23:00, og det går ikke stille for sig på stenen.<br>

Med Jean von Baden, Kjeld Tolstrup, Ung Flugt og Sami Kid, som nogle af kunsterne bag pulten, kan dette knapt nok kaldes et alternativ.
<p>Flyers: <a href="gfx/nyheder/abefest.jpg">Abefest</a> | <a href="gfx/nyheder/izabela.jpg">Izabela</a> | <a href="gfx/nyheder/playwithus.jpg">Play With Us</a></p>
<p>God weekend - når vi når dertil!</p>
</div>

<div class="nbilledebox"><a href="gfx/nyheder/link.jpg"><img class="nbillede" src="gfx/nyheder/link.jpg" alt=""></a></div>
<div class="nbilledetekst">
<b>Foreslå links?</b>

<p class="dato">21. marts 2009</p>
<p>Vi har nu smidt links op til sider vi selv synes er relevante. Men der er stadig plads til mange flere - så send mig endelig en <a href="mailto:mikael@xup.dk">mail</a> med webadresser du synes der mangler.</p>
</div>

<div class="nbilledebox1"><a href="gfx/nyheder/snart.jpg"><img class="nbillede" src="gfx/nyheder/snart.jpg" alt=""></a></div>
<div class="nbilledetekst1">
<b>Så er den der snart...</b>
<p class="dato">19. marts 2009</p>
<p>Efter en uge med hårdt arbejde, og lange nætters programmering, er vi ved at være dér, hvor vi skal være!</p>

<p><a href="http://www.xup.dk">Xup.dk</a> bliver nu  launched om godt og vel 11 dage, og min deadline ser lovende ud.</p>
<p>Xup.dk er lavet i <a href="http://da.wikipedia.org/wiki/Hypertext_Markup_Language">HTML</a>, <a href="http://da.wikipedia.org/wiki/CSS">CSS</a>, <a href="http://da.wikipedia.org/wiki/JavaScript">JavaScript</a>, <a href="http://da.wikipedia.org/wiki/PHP">PHP</a> og <a href="http://da.wikipedia.org/wiki/MySQL">MySQL</a>.</p>

<p>Siden skulle gerne være tilgængelig i alle browsere (selv mobil-browsere), eftersom den overholder alle <a href="http://www.w3c.org">W3C</a> standarderne.</p>
<p>Til sidst en lille OBS: Alle links her på siden åbner ikke et nyt vindue - så hver gang du trykker på et eksternt link, så hold CTRL tasten nede, hvis du ønsker fortsat at have Xup.dk kørerende i din browser - på den måde bliver et nyt vindue åbnet af det pågældende link. Dette er af hensyn til folk der ikke ønsker pop-ups.</p>
<p>Forslag, problemer osv. modtages på <a href="mailto:mikael@xup.dk">mikael@xup.dk</a></p>
</div>
</div>

<div id="spalte3">
<p class="copyright">© 2009 <a href="http://www.xup.dk">Xup.dk</a></p>

<p><a href="http://validator.w3.org/check?uri=referer">W3C HTML</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">W3C CS</a><a href="rediger.php">S</a></p>
</div>

<!-- Indsat for at stoppe float -->
<div style="clear:both"></div>

</body>

</html>
Avatar billede drinkit Praktikant
08. april 2009 - 18:47 #4
tror ikke helt jeg kan se hvad du har ændret udover float stop nederst... skal jeg ik bare ændre i mit stylesheet!
Avatar billede notes2c Nybegynder
08. april 2009 - 19:59 #5
skulle du ikke ha 20px luft i bunden eller har jeg misforstået dit spm
Avatar billede zips Juniormester
08. april 2009 - 20:27 #6
Hvad med noget i denne stil http://zips.be/exp/test/drinkit/

Her er det hele lagt ind i en wapper,samt lagt <div style="clear:both"></div> ind efter din slut div på spalte2

<div id="spalte2">
bla.bla.
</div><div style="clear:both"></div>

og med dette i din css

#wapper {
    width: 730px;
    background: #eee; 
}

#spalte1 { 
    float:left;
    height: 116px;
    width: 146px;
    border-right: 2px solid #777;
    border-bottom: 2px solid #777;
    border-left: 0px;
    border-top: 0px;
    padding: 10px;
}

#spalte2 {
    float:left;
    width: 528px;
    border-left: 2px solid #ccc;
    border-right: 2px solid #777;
    border-bottom: 2px solid #777;
    border-top: 0px;
    padding: 10px;
    margin-bottom: 20px;
    margin-left: 10px;
}

Spalte 3 er stadig position: absolute; men den kan jo også rettes til float.
Avatar billede drinkit Praktikant
09. april 2009 - 01:31 #7
Ok, jeg har gjort som du sagde zips og det hele er som det skal være nu :)
Tak for de andre comments, jeg forstod dem bare ik helt, eftersom jeg er lidt grøn på det her punkt.

- men ser det hele optimalt ud nu? eller burde mine divs være relative istedet for absolute?!
og er der andet der ikke giver mening i min kodning, eller er det optimalt det hele nu?
Det ser ud som det skal

- så smid endelig svar alle der har bidraget! mange tak!

Mikael
Avatar billede zips Juniormester
04. maj 2009 - 16:21 #8
Her er et svar :-)
Avatar billede zips Juniormester
04. maj 2009 - 16:43 #9
Tak for point :-)
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