Avatar billede Slettet bruger
11. april 2004 - 19:40 Der er 14 kommentarer og
1 løsning

Fejl i sidelængde

Hej

Jeg er i gang med at lave en hjemmeside for vores fodboldklub, og har lige observeret et underligt problem.

Går man ind på siden:
http://www.b91randers.dk/sider/kampinfo.php?show=161681

...og efterfølgende trykker på "Tilbage" og "Frem" (i Internet Explorer), mangler det nedeste af siden.
Trykker man "Opdater" er det som det skal være.

Sidens layout er lavet vha. CSS, og jeg går derfor ud fra at jeg er i den rigtige kategori.

Jeg bruger selv den nyeste version af IE.

Nogle med en idé om hvad problemet kan være?
Avatar billede roenving Novice
11. april 2004 - 19:49 #1
Jeg kan ikke genskabe problemet, men efter et hurtigt kig i Mozilla er jeg overbevist om, at du har fejl i dine tabeller, da siden ser forfærdelig ud ...
Avatar billede Slettet bruger
11. april 2004 - 19:53 #2
Hmmmm... bruger slet ikke tabeller på siden.
Avatar billede roenving Novice
11. april 2004 - 20:04 #3
Ja, jeg må jo indrømme, at jeg ikke kiggede i koden, da jeg så, at siden blev bredere og bredere for gang der kom et nyt element ...

Prøv at sætte den helt korrekte doctype ind, da ie ellers går i quirks-mode, dvs. at en eller anden programmør i Bombay bestemmer, hvad du mener med din kode:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>

-- og den må _kun_ stå på allerførste linje, ingen linjeskift foran !-)

-- din html-kode ser ellers okay ud, jeg ville nok have valgt nogle kortere classNames, for det trækker ned på overskueligheden, og du kunne også have forenklet din måde at få det til at fungere, hvis du havde udnyttet css-arv, altså f.eks.:

#menu_left a{}

-- i stedet for

.menu_venstre_knap{}

-- da du så ikke havde haft brug for at sætte class på dine links !o]
Avatar billede Slettet bruger
11. april 2004 - 20:10 #4
roenving...> Nu har jeg prøvet at sætte din doc-type ind, hvilket resulterede i total kaos på siden.
Dog kan jeg ikke på doc-typen til at stå på aller første linje, selvom den gør det i mit PHP-script??
Avatar billede roenving Novice
11. april 2004 - 20:27 #5
Så har du set præcis det samme, som jeg har set i Mozilla, for ved at bruge den korrekte doctype skulle den blive vist ens i alle browsere, som understøtter css ...

Og pga. dine mange classes (eller måske er det kun mange classNames på tags ?-) har jeg ikke prøvet at dissekere nærmere, men måske kunne det være en ide, at du smed dit indhold ind i nogle mere firkantede kasser, hvor det skulle blive ...

-- f.eks. ser det ud til at holdopstillingen ligger frit-svævende i body-div'en (et className eller id jeg iøvrigt vil fraråde, selvom der ikke nødvendigvis bør komme fejlmuligheder ud af det !-), så jeg gætter på at højre- og venstre-tingene er klaret med float, hvilket understøttes af, at du har højretingen først i koden ...
Avatar billede Slettet bruger
11. april 2004 - 20:34 #6
Dvs. at du mener jeg skal undlade at bruge float, men fastlåse de forskellige ting i kasser der altid er placeret samme sted?

Mht. css-arv forstår jeg ikke helt hvordan det fungerer. Kan du kort forklare?

Kan godt følge dig i at bruge kortere navne, men det giver også overskuelighed at bruge navne i min css-fil, jeg kan henføre til de rigtige steder på hjemmesiden.

Forstår dog ikke hvordan det kan være at toppen ser helt galt ud, når css'en skulle opfylde w3c's standard?
Avatar billede roenving Novice
11. april 2004 - 21:05 #7
Bagfra:

css-validatoren kigger jo ikke på dit layout ...

Ja, men, du kunne f.eks. mLeftOver i stedet for menu_venstre_overskrift (jeg bruger altid interCap i navngivning !-)

Der er en række muligheder for at angive mere præcise selektorer, f.eks. den ovenstående:

#menu_left a{}

som betyder alle a-tags, som ligger inde i elementet med id="menu_left" ...

Det kan også udvides, f.eks. til

#menu_left span a{}

og

#menu_left .enClass a{}

som betyder hhv. alle a-tags, som ligger inde i et span-tag, som ligger inde i elementet med id="menu_left" og alle a-tags, som ligger inde i et tag med class="enClass", som ligger inde i elementet med id="menu_left" ...

Du kan se mere her: http://www.w3.org/TR/REC-CSS2/selector.html#q1

-- og nej, jeg mener ikke at du generelt skal undlade at bruge floats, men kun bruge dem, når de gør præcis hvad du vil have dem til, og det er såvidt jeg kan se ikke relevant at bruge dem på den måde lige her, da du alligevel har 3 kasser ved siden af hinanden, så du vel bare skulle sætte float:left; på alle (3, for holdopstillingen bør også have en kasse !-) og give dem en bredde, for dit design, er vel ment som et fast et !o]
Avatar billede Slettet bruger
11. april 2004 - 21:22 #8
Hmmm... jeg kan simpelthen ikke forstå hvad du mener.... tror jeg ikke

I steder for at lave en #menu_left som styrer selve størrelsen af den kasse min menu ligger i, og en ."menu_venstre_knap der styrer størrelse af hver enkelt knap i min menu (incl. font, farver og den slags), laver jeg en #menu_left og en #menu_left a{}, hvilket vil give mig den samme mængde css-kode, men derimod mindre kodning i min html???
Avatar billede roenving Novice
11. april 2004 - 21:26 #9
Ja !-)
Avatar billede Slettet bruger
11. april 2004 - 21:31 #10
Okay, jeg vil prøve og kigge på siden, og få forenklet de forskellige ting.
Jeg vender tilbage i morgen, når det er sket.

Så må vi se om jeg er grædefærdig, eller om problemet er løst.

Indtil videre skal du have tak for hjælpen, og selvom du har point i spandevis, kan du selvfølgelig få pointene alligevel, da du har været til hjælp
Simplificering kan altid bruges, også selvom det ikke nødvendigvis lige løser mit problem :o)
Avatar billede roenving Novice
11. april 2004 - 21:51 #11
-- ja, men jeg foreslog forenklingen, bl.a. fordi jeg på forhånd opgav at dechiffrere din css-fil !-)

-- når du så har fået din html-kode så overskuelig, at jeg nemt kan jævnføre den med din css-kode, kan vi jo fortsætte med at finde og reparere eventuelle problemer !o]

-- og desuden er det et af de mål, jeg normalt stiller for kode, at den ser ens ud i de fleste browsere, så jeg vil normalt ikke stille mig tilfreds, hvis det ser voldsomt anderledes ud i f.eks. Mozilla ...
Avatar billede Slettet bruger
12. april 2004 - 10:31 #12
Jeg er nu i gang med at rette siden til, og grunden til at det hele har skubbet sig, er pga. padding.

Hvis jeg laver en boks eks. 100px x 100px, og sætter padding til "20px 0px 0px 20px", bliver boksen i stedet 120px x 120px på skærmen.

Det fatter jeg ikke lige hvorfor?
Avatar billede Slettet bruger
12. april 2004 - 17:52 #13
Så er hjemmesiden "forenklet".

Hvordan ser den ud i Mozilla?
Avatar billede Slettet bruger
15. april 2004 - 17:45 #14
Lukker...
Avatar billede roenving Novice
18. april 2004 - 00:00 #15
Den ser faktisk næsten ens ud i Mozilla og ie, den eneste forskel er, at baggrunden ikke kommer helt ned til bunden, men teksten har dog baggrund med, så det er fuldt læsbart !-)
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