|
| Forskelligt udseende i forskellige browser~ Fra : Anders |
Dato : 04-01-09 00:25 |
|
Hej,
Har lige lavet en hjemmeside (defohaka.t35.com).
Når siden hentes i IE7 ser den fin ud, men i opera, firefox,
safari og sikkert en del andre ser den helt gal ud. Det er vidst
placeringen af div-boksen til højre der går galt. Hvordan kan det
mon være? Har forsøgt at læse lidt herinde men kan ikke rigtigt
få det til at virke.
Det tilhørende stylesheet til siden ligger i roden af serveren og
hedder "style.css".
På forhånd mange tak for hjælpen :) !
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Birger Sørensen (04-01-2009)
| Kommentar Fra : Birger Sørensen |
Dato : 04-01-09 00:42 |
|
Anders formulerede spørgsmålet:
> Hej,
>
> Har lige lavet en hjemmeside (defohaka.t35.com).
>
> Når siden hentes i IE7 ser den fin ud, men i opera, firefox,
> safari og sikkert en del andre ser den helt gal ud. Det er vidst
> placeringen af div-boksen til højre der går galt. Hvordan kan det
> mon være? Har forsøgt at læse lidt herinde men kan ikke rigtigt
> få det til at virke.
>
> Det tilhørende stylesheet til siden ligger i roden af serveren og
> hedder "style.css".
>
> På forhånd mange tak for hjælpen :) !
Din "content" er kun 800px bred.
Der er ikke plads til både "bokset" og "boksto". Derfor falder "boksto"
under resten.
I øvrigt er det også derfor teksten på visse andre af siderne går ned
over signaturen.
Du mangler også en "clearfix" - som er nødvendig for at fortælle
browseren, at der ikke er flere floatede elementer i "content". Det kan
i visse tilfælde også medføre "misvisning" (fordi den ikke ved hvor
stor "content" er).
Spørgsmålet har vist i øvrigt ikke neget med ASP at gøre, men hører
vist mest til i webdesign.html.
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Anders (04-01-2009)
| Kommentar Fra : Anders |
Dato : 04-01-09 01:01 |
|
Birger Sørensen wrote in dk.edb.internet.webdesign.serverside.asp:
> Anders formulerede spørgsmålet:
> > Hej,
> >
> > Har lige lavet en hjemmeside (defohaka.t35.com).
> >
> > Når siden hentes i IE7 ser den fin ud, men i opera, firefox,
> > safari og sikkert en del andre ser den helt gal ud. Det er vidst
> > placeringen af div-boksen til højre der går galt. Hvordan kan det
> > mon være? Har forsøgt at læse lidt herinde men kan ikke rigtigt
> > få det til at virke.
> >
> > Det tilhørende stylesheet til siden ligger i roden af serveren og
> > hedder "style.css".
> >
> > På forhånd mange tak for hjælpen :) !
>
> Din "content" er kun 800px bred.
> Der er ikke plads til både "bokset" og "boksto". Derfor falder "boksto"
> under resten.
> I øvrigt er det også derfor teksten på visse andre af siderne går ned
> over signaturen.
> Du mangler også en "clearfix" - som er nødvendig for at fortælle
> browseren, at der ikke er flere floatede elementer i "content". Det kan
> i visse tilfælde også medføre "misvisning" (fordi den ikke ved hvor
> stor "content" er).
>
> Spørgsmålet har vist i øvrigt ikke neget med ASP at gøre, men hører
> vist mest til i webdesign.html.
>
> --
> http://varmeretter.dk - billig, sund og hurtig mad
> http://bbsorensen.dk
>
>
Burde nok have placeret spørgsmålet i den anden gruppe ja.
Hm. Kan godt se at det umiddelbart ville give mening, men efter et tjek af
stylesheetet kan jeg se at 'bokset' er 535px bred og 'boksto' er 258px -
altså tilsammen 793px. Mellemrummet mellem dem er sat til 7px med
'margin-left' under boksto så det skulle vel give 800px som det skal?
På de andre sider er div-boksen 800px men bliver alligevel bredere end
menubaren, topbaren og de andre. Synes det lyder lidt spøjst.
Er vidst ikke helt klar over hvad clearfix er :)
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Rune Jensen (04-01-2009)
| Kommentar Fra : Rune Jensen |
Dato : 04-01-09 01:31 |
|
Anders skrev:
> Er vidst ikke helt klar over hvad clearfix er :)
Typisk clear er vidst svjh:
<br style="clear:both" />
eller
<div style="clear:both"></div>
for at "stoppe" floating eller få ting til at faæde på plads i et design
med floats.
Det er imidlertid strukturelle elementer brugt til det, og problemet har
også været diskuteret her før, så andre har prøvet at finde metoder, så
der kunne cleares uden, kodens logik blev ødelagt.
http://positioniseverything.net/easyclearing.html
Jeg er ikke sikker på, det er den artikel, jeg tænkte på, for jeg har
ikke de "gamle" foretrukne mere ...kan være andre har en bedre?
MVH
Rune Jensen
| |
Anders (04-01-2009)
| Kommentar Fra : Anders |
Dato : 04-01-09 02:41 |
|
Rune Jensen wrote in dk.edb.internet.webdesign.serverside.asp:
> Anders skrev:
>
> > Er vidst ikke helt klar over hvad clearfix er :)
>
> Typisk clear er vidst svjh:
>
> <br style="clear:both" />
>
> eller
>
> <div style="clear:both"></div>
>
> for at "stoppe" floating eller få ting til at faæde på plads i et design
> med floats.
>
> Det er imidlertid strukturelle elementer brugt til det, og problemet har
> også været diskuteret her før, så andre har prøvet at finde metoder, så
> der kunne cleares uden, kodens logik blev ødelagt.
>
> http://positioniseverything.net/easyclearing.html
>
> Jeg er ikke sikker på, det er den artikel, jeg tænkte på, for jeg har
> ikke de "gamle" foretrukne mere ...kan være andre har en bedre?
>
>
> MVH
> Rune Jensen
Hm...Mon det virkelig skulle løse problemet? Skulle det mon have noget med
float at gøre? Og selvom det har: Hvorfor er siden så så meget bredere på de
andre sider? De er jo alle 800px brede iflg. stylesheetet...
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Anders (04-01-2009)
| Kommentar Fra : Anders |
Dato : 04-01-09 02:43 |
|
Rune Jensen wrote in dk.edb.internet.webdesign.serverside.asp:
> Anders skrev:
>
> > Er vidst ikke helt klar over hvad clearfix er :)
>
> Typisk clear er vidst svjh:
>
> <br style="clear:both" />
>
> eller
>
> <div style="clear:both"></div>
>
> for at "stoppe" floating eller få ting til at faæde på plads i et design
> med floats.
>
> Det er imidlertid strukturelle elementer brugt til det, og problemet har
> også været diskuteret her før, så andre har prøvet at finde metoder, så
> der kunne cleares uden, kodens logik blev ødelagt.
>
> http://positioniseverything.net/easyclearing.html
>
> Jeg er ikke sikker på, det er den artikel, jeg tænkte på, for jeg har
> ikke de "gamle" foretrukne mere ...kan være andre har en bedre?
>
>
> MVH
> Rune Jensen
Hm. Skulle det virkelig have noget med float at gøre? Det ændrer jo heller
ikke på at alle andre sider end forsiden er et stykke bredere på trods af at
alle bredder er sat til 800px iflg. stylesheetet?
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Birger Sørensen (04-01-2009)
| Kommentar Fra : Birger Sørensen |
Dato : 04-01-09 14:55 |
|
Anders tastede følgende:
> Birger Sørensen wrote in dk.edb.internet.webdesign.serverside.asp:
>> Anders formulerede spørgsmålet:
>>> Hej,
>>>
>>> Har lige lavet en hjemmeside (defohaka.t35.com).
>>>
>>> Når siden hentes i IE7 ser den fin ud, men i opera, firefox,
>>> safari og sikkert en del andre ser den helt gal ud. Det er vidst
>>> placeringen af div-boksen til højre der går galt. Hvordan kan det
>>> mon være? Har forsøgt at læse lidt herinde men kan ikke rigtigt
>>> få det til at virke.
>>>
>>> Det tilhørende stylesheet til siden ligger i roden af serveren og
>>> hedder "style.css".
>>>
>>> På forhånd mange tak for hjælpen :) !
>>
>> Din "content" er kun 800px bred.
>> Der er ikke plads til både "bokset" og "boksto". Derfor falder "boksto"
>> under resten.
>> I øvrigt er det også derfor teksten på visse andre af siderne går ned
>> over signaturen.
>> Du mangler også en "clearfix" - som er nødvendig for at fortælle
>> browseren, at der ikke er flere floatede elementer i "content". Det kan
>> i visse tilfælde også medføre "misvisning" (fordi den ikke ved hvor
>> stor "content" er).
>>
>> Spørgsmålet har vist i øvrigt ikke neget med ASP at gøre, men hører
>> vist mest til i webdesign.html.
>>
>> --
>> http://varmeretter.dk - billig, sund og hurtig mad
>> http://bbsorensen.dk
>>
>>
>
>
> Burde nok have placeret spørgsmålet i den anden gruppe ja.
>
> Hm. Kan godt se at det umiddelbart ville give mening, men efter et tjek af
> stylesheetet kan jeg se at 'bokset' er 535px bred og 'boksto' er 258px -
> altså tilsammen 793px. Mellemrummet mellem dem er sat til 7px med
> 'margin-left' under boksto så det skulle vel give 800px som det skal?
>
> På de andre sider er div-boksen 800px men bliver alligevel bredere end
> menubaren, topbaren og de andre. Synes det lyder lidt spøjst.
>
> Er vidst ikke helt klar over hvad clearfix er :)
Du har et element til venstre og et til højre. Browseren vil derfor
anbringe det der følger efter dem, imellem de to elementer, hvis du
ikke fortæller dem, at det skal den ikke.
En "clearfix", består i at give det element der følger efter de der
floater, css clear : both;. Du kan sætte den på din footer "lowerbar".
Dine div kan stadig ikke være ved siden af hinanden.
height og width angivelser pladsen inde i elementet. For at få den
Højde/bredde boksene reelt fylder, skal du includere padding, border og
margins. Så de to bokse er for store til at kunne være i "content".
Jeg har prøvet ovenstående i Firebug i FF, og så ser siden ud som den
gør i IE - bortset fra at den ikke er centreret.
For at løse det skal du nok sætte det hele i en div der er bred nok til
at kunne indeholde det, og sætte margin : 0px auto; på denne.
Spm hører stadig til i html, ikke asp.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Anders (04-01-2009)
| Kommentar Fra : Anders |
Dato : 04-01-09 16:02 |
|
Birger Sørensen wrote in dk.edb.internet.webdesign.serverside.asp:
> Anders tastede følgende:
> > Birger Sørensen wrote in dk.edb.internet.webdesign.serverside.asp:
> >> Anders formulerede spørgsmålet:
> >>> Hej,
> >>>
> >>> Har lige lavet en hjemmeside (defohaka.t35.com).
> >>>
> >>> Når siden hentes i IE7 ser den fin ud, men i opera, firefox,
> >>> safari og sikkert en del andre ser den helt gal ud. Det er vidst
> >>> placeringen af div-boksen til højre der går galt. Hvordan kan det
> >>> mon være? Har forsøgt at læse lidt herinde men kan ikke rigtigt
> >>> få det til at virke.
> >>>
> >>> Det tilhørende stylesheet til siden ligger i roden af serveren og
> >>> hedder "style.css".
> >>>
> >>> På forhånd mange tak for hjælpen :) !
> >>
> >> Din "content" er kun 800px bred.
> >> Der er ikke plads til både "bokset" og "boksto". Derfor falder "boksto"
> >> under resten.
> >> I øvrigt er det også derfor teksten på visse andre af siderne går ned
> >> over signaturen.
> >> Du mangler også en "clearfix" - som er nødvendig for at fortælle
> >> browseren, at der ikke er flere floatede elementer i "content". Det kan
> >> i visse tilfælde også medføre "misvisning" (fordi den ikke ved hvor
> >> stor "content" er).
> >>
> >> Spørgsmålet har vist i øvrigt ikke neget med ASP at gøre, men hører
> >> vist mest til i webdesign.html.
> >>
> >> --
> >> http://varmeretter.dk - billig, sund og hurtig mad
> >> http://bbsorensen.dk
Det med clear:both under "lowerbar" virkede. Jeg har opdateret siden så
ændringen kan ses. Tak for det !! Har kæmpet med det længe.
Ved at mindske bredderne på "bokset" og "boksto" kom de også på plads ganske
som de skulle, men hvis man kigger på siden i fx IE7 og Firefox er der nu
forskel på hvor brede de er i de 2 browsere. Ingen af dem er så brede som de
skal være - det ved jeg, men det er jo svært at vide hvor meget bredde man skal
give dem for at det hele passer hvis boksenes bredde varierer alt efter hvilken
browser man kigger på dem i.
Ville være fedt hvis nogen kunne finde løsningen :)
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Anders (04-01-2009)
| Kommentar Fra : Anders |
Dato : 04-01-09 16:22 |
|
> Du har et element til venstre og et til højre. Browseren vil derfor
> anbringe det der følger efter dem, imellem de to elementer, hvis du
> ikke fortæller dem, at det skal den ikke.
> En "clearfix", består i at give det element der følger efter de der
> floater, css clear : both;. Du kan sætte den på din footer "lowerbar".
>
> Dine div kan stadig ikke være ved siden af hinanden.
> height og width angivelser pladsen inde i elementet. For at få den
> Højde/bredde boksene reelt fylder, skal du includere padding, border og
> margins. Så de to bokse er for store til at kunne være i "content".
>
> Jeg har prøvet ovenstående i Firebug i FF, og så ser siden ud som den
> gør i IE - bortset fra at den ikke er centreret.
>
> For at løse det skal du nok sætte det hele i en div der er bred nok til
> at kunne indeholde det, og sætte margin : 0px auto; på denne.
>
> Spm hører stadig til i html, ikke asp.
>
> Birger
>
> --
> http://varmeretter.dk - billig, sund og hurtig mad
> http://bbsorensen.dk
I mellemtiden kom jeg lige til at kigge på de andre 3 sider. Der er det som om
der er angivet en højde i enten "content" eller "bokstre", men det er der altså
ikke. Kan virkelig ikke forstå hvor browseren har fået den ide fra - og det ser
jo også fint ud u IE7?
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Birger Sørensen (04-01-2009)
| Kommentar Fra : Birger Sørensen |
Dato : 04-01-09 18:36 |
|
Anders sendte dette med sin computer:
>> Du har et element til venstre og et til højre. Browseren vil derfor
>> anbringe det der følger efter dem, imellem de to elementer, hvis du
>> ikke fortæller dem, at det skal den ikke.
>> En "clearfix", består i at give det element der følger efter de der
>> floater, css clear : both;. Du kan sætte den på din footer "lowerbar".
>>
>> Dine div kan stadig ikke være ved siden af hinanden.
>> height og width angivelser pladsen inde i elementet. For at få den
>> Højde/bredde boksene reelt fylder, skal du includere padding, border og
>> margins. Så de to bokse er for store til at kunne være i "content".
>>
>> Jeg har prøvet ovenstående i Firebug i FF, og så ser siden ud som den
>> gør i IE - bortset fra at den ikke er centreret.
>>
>> For at løse det skal du nok sætte det hele i en div der er bred nok til
>> at kunne indeholde det, og sætte margin : 0px auto; på denne.
>>
>> Spm hører stadig til i html, ikke asp.
>>
>> Birger
>>
>> --
>> http://varmeretter.dk - billig, sund og hurtig mad
>> http://bbsorensen.dk
>
>
> I mellemtiden kom jeg lige til at kigge på de andre 3 sider. Der er det som
> om der er angivet en højde i enten "content" eller "bokstre", men det er der
> altså ikke. Kan virkelig ikke forstå hvor browseren har fået den ide fra - og
> det ser jo også fint ud u IE7?
Forstår så fint dine frustrationer mht. at tingene vises rigtigt i IE,
og ikke i de andre.
Vend din tankegang på hovedet.
FF er den browser der bedst følger standarderne. Hvis siden ikke vises
som forventet i FF, er det formentlig fordi dinkode ikke validerer
(eller designet ikke er tænkt rigtigt igennem).
Der er HTML validerings-fejl på de andre sider du refererer til -
forsiden er nu OK hvad det andgår.
Der er også CSS fejl.
Du er nødt til at rette de fejl - ellers kan du ikke forstå at
browserne skal forstå hvad du mener, eller tolke det bare nogenlunde
ens...
Spørgsmålet hører stadig til i html gruppen. Der er folk der, der er
meget bedre til at svare på den slags end jeg er...
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Anders (05-01-2009)
| Kommentar Fra : Anders |
Dato : 05-01-09 10:10 |
|
>
> Forstår så fint dine frustrationer mht. at tingene vises rigtigt i IE,
> og ikke i de andre.
> Vend din tankegang på hovedet.
> FF er den browser der bedst følger standarderne. Hvis siden ikke vises
> som forventet i FF, er det formentlig fordi dinkode ikke validerer
> (eller designet ikke er tænkt rigtigt igennem).
> Der er HTML validerings-fejl på de andre sider du refererer til -
> forsiden er nu OK hvad det andgår.
> Der er også CSS fejl.
>
> Du er nødt til at rette de fejl - ellers kan du ikke forstå at
> browserne skal forstå hvad du mener, eller tolke det bare nogenlunde
> ens...
>
> Spørgsmålet hører stadig til i html gruppen. Der er folk der, der er
> meget bedre til at svare på den slags end jeg er...
>
> Birger
>
> --
> http://varmeretter.dk - billig, sund og hurtig mad
> http://bbsorensen.dk
Ved godt at det spørgsmålet hører til i den anden gruppe, men nu kender du jo
forløbet så tænkte det var lige så nemt at gøre det færdigt her.
Jeg er opmærksom på at siderne bør valideres og dette var da også det første jeg
gjorde (med forsiden ganske rigtigt) da jeg opdagede det så galt ud i de andre
browsere. Problemet var bare at det ikke hjalp selvom validatoren meldte 0 fejl så
jeg gik ikke længere ud fra at man kunne sætte lighedstegn mellem "ingen
valideringsfejl" og "pæne sider".
Du har sikkert ret - jeg prøver at hente FF, rette valideringsfejlene på de andre
sider og se om jeg kan få det til at se nogenlunde ud i FF :S
Ellers skriver jeg igen :)
Savner godt nok en database over tags og koder der kan anvendes i de mest gængse
browsere - hvis der da findes sådan en!
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Birger Sørensen (05-01-2009)
| Kommentar Fra : Birger Sørensen |
Dato : 05-01-09 16:20 |
|
Anders formulerede spørgsmålet:
>
> Ved godt at det spørgsmålet hører til i den anden gruppe, men nu kender du jo
> forløbet så tænkte det var lige så nemt at gøre det færdigt her.
>
> Jeg er opmærksom på at siderne bør valideres og dette var da også det første
> jeg gjorde (med forsiden ganske rigtigt) da jeg opdagede det så galt ud i de
> andre browsere. Problemet var bare at det ikke hjalp selvom validatoren
> meldte 0 fejl så jeg gik ikke længere ud fra at man kunne sætte lighedstegn
> mellem "ingen valideringsfejl" og "pæne sider".
>
> Du har sikkert ret - jeg prøver at hente FF, rette valideringsfejlene på de
> andre sider og se om jeg kan få det til at se nogenlunde ud i FF :S
>
> Ellers skriver jeg igen :)
>
> Savner godt nok en database over tags og koder der kan anvendes i de mest
> gængse browsere - hvis der da findes sådan en!
Ingen valideringsfejl er desværre ikke nogen garanti for at designet er
i orden :/
Som du selv har oplevet, kan man f.eks. mangle clear efter floatede
elementer - og at koden validerer er heller ingen garanti for at
designet fungerer. Der er masser af muligheder for at gå galt i byen.
Det omvendte kan til gengæld godt være rigtigt => hvis der er
valideringsfejl, vises siden i hvert fald ikke rigtigt i alle browsere!
Der er sikkert mange databaser over tags. Det ville der formentlig
komme indtil mange svar på i den rigtige gruppe
Jeg bruger den her side. Det har visse fordele, frem for hjemmegjorte,
eller indbyggede i andre programmer :
http://www.w3.org/TR/html401/index/elements.html
Hvis/når du skriver igen, så gør det i den rigtige gruppe.
Både af hensyn til asp gruppens brugere, og fordi du der vil få mere
varierede svar, og meninger om hvordan tingene kan/skal gøres
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk
| |
Stig Johansen (05-01-2009)
| Kommentar Fra : Stig Johansen |
Dato : 05-01-09 18:19 |
|
Anders wrote:
> Savner godt nok en database over tags og koder der kan anvendes i de mest
> gængse browsere - hvis der da findes sådan en!
Det findes der, men det er ikke en 'database', men forskellige definitioner
af dokumenttyper.
Du har valgt
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
som er en transitional DTD:
reglerne er beskrevet her:
< http://www.w3.org/TR/html4/sgml/loosedtd.html>
andre regler for en given DTD:
< http://htmlhelp.com/tools/validator/doctype.html>
(Regelsættet findes under den tilhørende URI)
--
Med venlig hilsen
Stig Johansen
| |
Jørn Andersen (04-01-2009)
| Kommentar Fra : Jørn Andersen |
Dato : 04-01-09 00:40 |
|
On 03 Jan 2009 23:24:32 GMT, Anders <on_tw_thre@hotmail.com> wrote:
>Har lige lavet en hjemmeside (defohaka.t35.com).
>
>Når siden hentes i IE7 ser den fin ud, men i opera, firefox,
>safari og sikkert en del andre ser den helt gal ud. Det er vidst
>placeringen af div-boksen til højre der går galt. Hvordan kan det
>mon være? Har forsøgt at læse lidt herinde men kan ikke rigtigt
>få det til at virke.
>
>Det tilhørende stylesheet til siden ligger i roden af serveren og
>hedder "style.css".
Det er ikke et ASP-problem, og du vil få bedre hjælp i gruppen:
dk.edb.internet.webdesign.html
Good luck!
--
Jørn Andersen,
Brønshøj
| |
|
|