Jeg har længe kæmpet med at få lavet en generisk boks i css/html til tekst, som virker både i IE og Firefox, men jeg kan simpelthen ikke få det til at virke!
Jeg har lavet et lille eksempel, men det virker ikke i Firefox :-( Eksemplet består af en div, ud over 3 andre bokse. De to bokse i siderne indeholder et billede som er 100% height, og boksen i midten indeholder tekst. Problemet er et jeg ikke vil angive højden på min boks, da den skal udvide sig efter hvor meget tekst der står i den. Men yderboksen (den røde), vil ikke udvide sig od over den blå.
Uden en fuld DTD kan du ikke bruge CSS i IE. Når noget ser rigtigt ud i IE og du ikke bruger en fuld DTD, er CSS'en formodentligt forkert: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Dernæst skal du sætte body- og html-elementernes højde til 100%, hvis du vil bruge relative højder på elementer, der ligger i body'en:
hej igen... ok nu har jeg endlig fået lagt den online ;-) og jeg har ændret den som jeg oprindelig ville have, så side billederne kommet ind i css'en igen. Jeg kan dog stadig ikke få den vist korrekt...jeg har forsøgt rigtig mange ting, men kan ikke finde den korrekte måde at gøre det på :-( vh Claus Siden kan findes her: http://www.fhelth.dk/test/
Men derudover kommer du ikke udenom at give dit yderste div en højde. CSS-standarden foreskriver, at hvis man sætter en relativ højde på et element, skal denne beregnes udfra højden, sat på det omkransende element
ok..jeg har tit benyttet tabeller, men jeg kunne godt tænke mig at lave en generisk boks (som jeg senere vil ligge ind i en kontrol i C#). På den måde vil jeg kunne sætte mine div bokse ind i hinanden. (jeg har både top og bund klar, men højden på midten driller hele tiden)
hov tror jeg misforstod din besked om beregning af højden. Men er det ikke muligt at lave en div der har relativ højde, og inden i den en anden div med 100% som højde, som kan benyttes til tekst. Når teksten er blevet renderet i div elementet ville jeg jo så se om jeg kunne finde højden på det inderste element, og derefter give den yderste div denne højde. Jeg mener det er blevet gjort på jubii's side, men det er ret uforståeligt at læse deres css.
jeg har kigget i jubii's html, og de bruger kun table et sted, og det er ikke til at lave en boks. Deres design ændrer sig afhænigt af indholdets størrelse, men de bruger ikke tables...derfor må man jo kunne manipulere højden på et div element!
ahh..ok, jeg ved ikke om det helt passer det jeg skrev før. Jeg har testet noget mere, og det ser ud som om det bliver gjort på en lidt anden måde.
Dog kunne det være meget interessant at vide om det er mulligt via css at læsse en anden div's højde, for der efter at kunne give en anden div samme højde!
Jubii's små bokse ude i siden består af lange baggrundsbilleder, som har en fast width. billedet er sat nederst i det ene hjørne, og jo mere man skriver i boksen jo mere af baggrundsbilledet bliver vist.
Kan du ikke lige banke en gif/jpg op af, hvordan du vil have det færdige resultat til at se ud (med top og bund). Så skal jeg lige klippe grafikken og banke HTML'en af
<div style="width:82px;border:1px solid blue;margin:0px auto;text-align:left"> hej der! hvem er du så min ven.<br /> hej der!<br /> hej der!<br /> </div>
</div> </div>
'text-align:center' for at centrere i ældre opdateringer af IE6 end den seneste. 'margin:0px auto' for at centrere i alle andre brusere. 'text-align:center' - da teksten ellers arver centreringen
Super cool, den løsning havde jeg faktisk været inde på uden at teste det, men man har det med at gøre tingene sværere end de i virkeligheden er ;-), takker mange gange.
quisifa -> Ja det har du ret i. Min holdning til html er at vi ikke altid kan tage højde for samtlige browsere på markedet. Jeg mener ikke man bruger sin tid effektivt nok, hvis man skal tjekke alle browsere på alt hvad man laver, da størstedelen af brugerne kun bruger et snævert udsnit. Jeg må indrømme jeg ikke havde prøvet firebird før. Men inden jeg gik i gang med at ændre hele mit design, tjekkede jeg en statistik på fdim's hjemmeside (http://www.fdim.dk/default.asp?vis=page&ID=73), og må desværre tørt konstatere at top 5 på mest benyttede browsere står for 98%, og ud over IE er de eneste andre to konkurrenter Netscape 4.0 og Firefox 1.0....men tak for hjælpen alligevel ;-)
quisifa >> Hvad er det, du ikke mener fungerer i FF/Moz?
claushelth >> Man kan næsten altid tage højde for stort set samtlige browsere på markedet. Den slags statistikker er ikke en døjt værd og oplyser intet om, hvad dit site bør understøtte. Gå i en laaaang bue uden om dem ... det gør alle professionelle ;o)
Tak for det olebole, jeg kan iøvrigt sige at jeg har fået bygget denne generiske boks ind i en control i asp.net, og det er super nemt nu at lave hjemmesider med dem. Den understøtter bla.a. margin, padding og de 8 gfx elementer kan ændres via css'en. Nu skal jeg have bygget background-imae ind i den, samt lidt andre småtingt.
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.