Fetstil Fetstil Kursiv Understrykning linje färgläggning tabellverk Punktlista Nummerlista Vänster Centrerat högerställt Utfyllt Länk Bild htmlmode
  • Forum & Blog
    • Forum - översikt
      • .Net
        • asp.net generellt
        • c#
        • vb.net
        • f#
        • silverlight
        • microsoft surface
        • visual studio .net
      • databaser
        • sql-server
        • databaser
        • access
        • mysql
      • mjukvara klient
        • datorer och komponenter
        • nätverk, lan/wan
        • operativsystem
        • programvaror
        • säkerhet, inställningar
        • windows server
        • allmänt
        • crystal reports
        • exchange/outlook
        • microsoft office
      • mjukvara server
        • active directory
        • biztalk
        • exchange
        • linux
        • sharepoint
        • webbservers
        • sql server
      • appar (win/mobil)
      • programspråk
        • c++
        • delphi
        • java
        • quick basic
        • visual basic
      • scripting
        • asp 3.0
        • flash actionscript
        • html css
        • javascript
        • php
        • regular expresssion
        • xml
      • spel och grafik
        • DirectX
        • Spel och grafik
      • ledning
        • Arkitektur
        • Systemutveckling
        • krav och test
        • projektledning
        • ledningsfrågor
      • vb-sektioner
        • activeX
        • windows api
        • elektronik
        • internet
        • komponenter
        • nätverk
        • operativsystem
      • övriga forum
        • arbete karriär
        • erbjuda uppdrag och tjänster
        • juridiska frågor
        • köp och sälj
        • matematik och fysik
        • intern information
        • skrivklåda
        • webb-operatörer
    • Posta inlägg i forumet
    • Chatta med andra
  • Konto
    • Medlemssida
    • Byta lösenord
    • Bli bonsumedlem
    • iMail
  • Material
    • Tips & tricks
    • Artiklar
    • Programarkiv
  • JOBB
  • Student
    • Studentlicenser
  • KONTAKT
    • Om pellesoft
    • Grundare
    • Kontakta oss
    • Annonsering
    • Partners
    • Felanmälan
  • Logga in

Hem / Forum översikt / inlägg

Posta nytt inlägg


Height 100 i nested div

Postades av 2007-02-27 15:19:57 - Tomas Lundgren, i forum html/css, Tråden har 7 Kommentarer och lästs av 1034 personer

Hej,

Jag vill ha en sida med en huvuddiv och en nästlad div som alltid är 100% av skärmen eller hela sidan (hela sidan även scroll). Den ska fungera i ie6 och 7.

Sätter jag height:100%; fungerar det för hela skärmen men inte för hela innehållet. Sätter jag bara min-height:100%; får jag inte höjden.

Någon som är vass på css som kan hjälpa till?



<code>
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>test</title>


<style>
html,body,form
{
font-family: Verdana, Arial, Helvetica, Tahoma;
font-size: 0.86em;
color: #333;
padding: 0px auto;
margin: 0px auto;
height:100%;
min-height:100%;
width:100%;
}

#containerdiv
{
float:left;
width: 100%;
margin: 0em auto;
text-align:left;
border:solid black 1px;
padding:0px;
min-height:100%;
_height:100%; /*Ignored by IE7*/
}

#containerdivleft
{
margin:0px auto;
width: 30em;
min-height:100%;
_height:100%;
border:solid blue 1px;
}

#containerdivright
{
width:100%;
max-height:100%;
_height:100%;
border:solid red 1px;
}

</style>


</head>

<body>
<form>
<div id="containerdivleft">
<div id="containerdivright">
<div id="containerdiv">
test
<!--
&nbsp;<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
asdfasdf asdf
test&nbsp;<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
asdfasdf asdf

-->
</div>
</div>
</div>

</form>
</body>
</html>
</code>


Svara

Sv: Height 100 i nested div

Postades av 2007-02-27 18:36:38 - Jonas Boman

Jag är säkert trög men jag förstår inte precis hur du vill ha det.

Är det för IE7 det inte fungerar eller vilken browser fungerar det inte för?


Svara

Sv:Height 100 i nested div

Postades av 2007-02-28 14:12:16 - Tomas Lundgren

Hej,

Jag får det inte att fungera i ie7.

Som du ser så har jag lagt in lite remmade <br> i koden. Problemet är att jag får höjden över hela skärmen men om sidan är lång och har scrollister så slutar ramen på varje div där skärmen slutar innan man börjar scrolla. Jag vill att det ska fungera i ie6 oxå men det är med ie7 och den nya min-height jag får problem.

Kanske ska lägga till att alla divar ska ha height 100%.


Svara

Sv: Height 100 i nested div

Postades av 2007-03-02 10:50:28 - Ted Nyberg

En DIV kan inte ha höjd "100%". Du får scripta det och knyta metoden till window.onresize!


Svara

Sv:Height 100 i nested div

Postades av 2007-03-02 11:13:41 - Per Persson

Jodå, men <b>height: 100%</b> sätter höjden till 100% av närmaste yttre element som också ha height satt.


Svara

Sv: Height 100 i nested div

Postades av 2007-03-02 13:31:15 - Ted Nyberg

Exakt Per, i detta forum håller jag med dig! :)


Svara

Sv:Height 100 i nested div

Postades av 2007-03-04 19:59:25 - Lillan Backa

För det första så kommer inte din sida att validera eftersom du använder doctype för xhtml men skriver inte xhtml. Du kan INTE använda <br> utan du måste använda slashen i kombination eftersom en radbrytning är en tom märkning. Korrekt kod ska se ut så här <br />

Din css kallar inte korrekt om du inte heller använder denna kod som också är kompatibel med xhtml 1.1

<style type="text/css">
<!--
HÄR ÄR DIN CSS
-->
</style>

Du kallar på html,body och form - lägg in märkningen för dina divar - #html, body, form

att utesluta denna kan ge problem eftersom classattributen kan definieras på samma sätt.

Du säger också att du vill ha en omslutande container i vilken dina andra div boxar flyter, men i din html kallar du faktiskt först på divleft sedan divright för att till slut ange container div men var kallar du på din form? Du måste ange <div id="form">resten av dina koder</div>

Spontant tycker jag att du ska läsa lite mer om vad xhtml/css är och hur dessa samarbetar.

Som en sista utväg kan du använda conditional comments vilket är att föredra istället för ie hacks.

mvh/Lena


Svara

Sv: Height 100 i nested div

Postades av 2007-03-05 14:13:52 - Tomas Lundgren

Hej,

Jag löste det med ett javascript.

Lena, tack för tipsen, känner dock till det innan så det var inte direkt någon hjälp för att lösa problemet. Koden jag skickade in i tråden var bara något jag slängde upp så att andra enkelt kund klippa och klistra. I min "skarpa" kod ligger en massa asp.net prylar.


Svara

Nyligen

  • 19:55 kick-off med fokus på hälsa?
  • 19:53 kick-off med fokus på hälsa?
  • 16:24 Föreslå en skönhetsklinik online
  • 16:23 Föreslå en skönhetsklinik online
  • 18:42 Hvor finder man håndlavede lamper
  • 18:41 Hvor finder man håndlavede lamper
  • 16:36 Allt du behöver veta om keramiskt
  • 16:14 Vem anlitar man egentligen när tak

Sidor

  • Hem
  • Bli bonusmedlem
  • Läs artiklar
  • Chatta med andra
  • Sök och erbjud jobb
  • Kontakta oss
  • Studentlicenser
  • Skriv en artikel

Statistik

Antal besökare:
Antal medlemmar:
Antal inlägg:
Online:
På chatten:
4 570 722
27 958
271 751
198
0

Kontakta oss

Frågor runt konsultation, rådgivning, uppdrag, rekrytering, annonsering och övriga ärenden. Ring: 0730-88 22 24 | pelle@pellesoft.se

© 1986-2013 PelleSoft AB. Last Build 4.1.7169.18070 (2019-08-18 10:02:21) 4.0.30319.42000
  • Om
  • Kontakta
  • Regler
  • Cookies