Hey.. Jeg er ved at bakse noget sammen her : http://new.cskoven.com/ Istedet for det, det er nu (scrolle hele siden), skal det gerne være sådan, at man kan scrolle i højre side af 3. blok (den blå), sådan at hvis teksten fylder mere end én sidehøjde, skal man blot scrolle i den, og ikke hele siden. Dvs. den nederste gråblok, skal hele tiden være synlig på billedet.. Siden er pt. ikke kompatibel med M$ IE. Jeg ønsker at undgå IFrames...
http://new.cskoven.com/style.css Ja, i og med jeg har sat hele dokumentet til at være have en height på 100% Ellers kan jeg jo ikke få sitet til at fylde en hel side...
For at den her løsning jeg nu kommer med skal virke, skal de to bokse til venstre være seperate element, dvs. ikke en del af elementet som hovedboxen er med i, i denne situation er de i samme table.
Men så er det også meget let at få gjort uden iframes, bortset fra at det ikke virker i IE. Lækkert. Men det er forholdsvis enkelt og det virker.
Du lægger box1 og box2 ind i et div, og det giver du så postion:fixed; top:0; left:0;
og evt.
width: 100%;
Efter hvad jeg ved, så burde det virke, nu sidder den altid det samme sted, og menuen kører med ned når du scroller.
Men det jeg tænkte på var, om du har sat højde på: <td valign="top" class="box3">. Du er nød til at have højde på elementet, ellers ved browseren ikke hvornår teksten gå ud over 'rammen' (Altså hvornår der er overflow).
Desuden kan du ikke benytte de oldnordiske attributter som valign="top" sammen med XHTML. Og så bør du læse oleboles artikler om XHTML: http://exp.dk/artikler/537 og http://exp.dk/artikler/538 , hvor han forklarer hvorfor man ikke kan benytte XHTML optimalt endnu. Du bør holde dig til HTML 4.01 (Evt. strict, hvis du vil være så tæt på XHTML som muligt)
cskoven > Nu kan jeg i det mindste se noget tekst, men det ligner ikke normal CSS; Der er en masse firkanter i teksten, og det står i en lang køre, uden orden. Jeg ved ikke hvad det skyldes.
apo: hmm det står i normal orden hos mig og andre Linuxbrugere, jeg har vist det til... jeg skriver det bare i en ganske normal editor (bluefish) til Linux...
apo > Ser du stadig CSS informationer, bare med en masse firkanter? Så er det nok p.g.a. linux linebreaks som er anderledes end Windows linebreaks, det plejer dog kun at være notesblok som ikke kan hitte ud af dem.
Mærkeligt. Jeg plejer ikke at have problemer med at åbne og få vist CSS-filer korrekt. Kan det skyldes at jeg kører med Windows, og at I kører med Linux (Kan det have noget at sige)?
cskoven > Ja, det kan du godt gøre. Det skal så før det andet i koden, og da det originale tabel så kun har én celle har du dybest set ikke brug for det mere, så er det mere logisk med et <div>, som du så kan give en margin-left der svarer til bredden af de to bokse til venstre tilsammen, plus evt. margen imellem dem og dit indhold.
apo > Hvis du kopierer det hele og sætter det ind i Wordpad skulle det meget gerne give mening. Wordpad kan nemlig af en eller anden grund godt tåle Linux linebreaks, hvorimod Notesblok som sagt ikke kan.
For at få disse divs til at ligge på samme måde, skal den længst til venstre have en float:left; og en bestemt bredde, og det <div> der skal wrappe udenom de to venstresøjler skal ligeledes have en bestemt bredde som passer til de to søjler's bredde lagt sammen.
box1and2 skal ikke have float:left; Det skal have position:fixed; og top:0; og left:0; som jeg skrev i mit første indlæg i denne thread. :)
Derimod mente jeg at det var box1 der skulle have float:left;, så burde det virke.
Og forresten, så vil jeg anbefale at du bruger <h1> tags til overskrifter istedet for <div class="headline">, da <h1> er et element der er beregnet til store overskrifter. :) (tilsvarende er der <h2>,<h3> etc. hele vejen ned til <h6> til mindre overskrifter)
electricnet: thx..! Så mangler jeg bare den blå's størrelse, og at få den nederste grå til at være under alle 3. Hmm og sys ikk der er nogen afstand imellem den rød cskoven.com og menu? Selvom jeg har defineret border + givet plads til border?
Nu kunne jeg ikke lige helt finde ud at om du har fundet en løsning på dit problem, men jeg sad med noget af det samme og fandt på en god løsning forleden som endda som en lille bonus virker perfekt i IE.... :-)
Jeg er amatør så bær over med mig hvis jeg ikke forklare så godt :-)
Du sætter overflow: hidden for body. Så smider du den blå boks ind øverst i dit html og sætter width og height til 100% - og overflow til auto ! Du laver også en venstre padding der tilsvare den grå og røde boks bredte....
Dernæst smider du simpelthen bare den grå, den røde og den grå i bunden ind i dit html og positionere det med absolute i noget css ! ... Ja, det burde være det :-)
nå, der skulle lige en anelse mere til, men det er en rimelig simpel måde at lave det på synes jeg.. har lige lavet en lille meget hurtig kladde så du kan se hvad jeg mener... Har ikke lige testet det her i IE da jeg sider med en Mac, men det burde virke.. !? :-)
Hmm.. Ser nu at min model har nogle problemer... Dels bliver scrollbaren lidt dækket af den grå boks i bunden ( i safari, ikke i firefox ) - og i firefox vil den ikke scrolle via mit track pad som den ellers burde !? - ved ikke lige hvordan man løser dette !?
kongknabe > Interessant! Her virker det fint, bortset fra der er et lille hul mellem bunden af siden og bunden af browservinduet.
cskoven > Jeg tror ikke du kan lægge footeren nedenunder alting uden at det skal give en masse problemer. :/
Jeg så dog lidt problemer med scrollbarene, og jeg fik det løst ved at fjerne width:100%; på både box3 og box4. Jeg tror den fik dem til at gå ud over kanten, og det virker fint uden. Og så kan man ikke kommentere i CSS med //, så din overflow:hidden; blev stadig læst. Den skal også slettes, erfarede jeg. Så burde det virke perfekt. :D
Og den der med kanten imellem box1 og 2 er lidt svær. :/ Jeg kan ikke se hvorfor den ikke skulle være der, hvis du har lavet den rigtige bredde og de rigtige antal kanter med den rigtige tykkelse.
net.
Synes godt om
Ny brugerNybegynder
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.