/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
position - relative og absolute
Fra : Erik Ginnerskov


Dato : 21-08-03 17:27

Hej NG
Jeg fik en klage vedrørende www.hjemmesideskolen.dk/scripts/diastxt.asp
gående på, at hvis siden sås i en full screen browser på 1280x1024 px,
vistes teksten skævt i forhold til den beregnede plads.

Forsøgte så med at sætte en relativ position på tabellen og derefter at
positionere teksterne absolut i forhold til tabellen i stedet for
browservinduets øverste venstre hjørne.

Det virker fint i MSIE 5.5 og 6 og Opera 6.05 og 7.11, men i Mozilla 1.2.1
og 1.3 og Netscape 6.2.3 og 7.0 går der ged i positioneringen af teksterne,
hvorfor?

Alt kører på W98SE. De gamle browsere kan kun testes i 800x600px, men de nye
kan testes i op til 1280x1024px - på min maskinpark.

Se forsøget her:

www.hjemmesideskolen.dk/scripts/diastxt2.asp

--
Med venlig hilsen
Erik Ginnerskov
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/egin



 
 
Villum Sejersen (21-08-2003)
Kommentar
Fra : Villum Sejersen


Dato : 21-08-03 18:01

Erik Ginnerskov wrote:
> Hej NG
> Jeg fik en klage vedrørende www.hjemmesideskolen.dk/scripts/diastxt.asp
> gående på, at hvis siden sås i en full screen browser på 1280x1024 px,
> vistes teksten skævt i forhold til den beregnede plads.
>
> Forsøgte så med at sætte en relativ position på tabellen og derefter at
> positionere teksterne absolut i forhold til tabellen i stedet for
> browservinduets øverste venstre hjørne.
>
> Det virker fint i MSIE 5.5 og 6 og Opera 6.05 og 7.11, men i Mozilla 1.2.1
> og 1.3 og Netscape 6.2.3 og 7.0 går der ged i positioneringen af teksterne,
> hvorfor?
>
> Alt kører på W98SE. De gamle browsere kan kun testes i 800x600px, men de nye
> kan testes i op til 1280x1024px - på min maskinpark.
>
> Se forsøget her:
>
> www.hjemmesideskolen.dk/scripts/diastxt2.asp

Jeg kan ikke se nogen forskel på de to ved de seneste nightly builds
20003-08-20 af Mozilla 1.5b / Thunderbird 0.6.1+ ved 1280x1024 under w2k.

--
mvh. Villum Sejersen


Frederik Østeraa (21-08-2003)
Kommentar
Fra : Frederik Østeraa


Dato : 21-08-03 20:12

Erik Ginnerskov wrote:

> Det virker fint i MSIE 5.5 og 6 og Opera 6.05 og 7.11, men i Mozilla 1.2.1
> og 1.3 og Netscape 6.2.3 og 7.0 går der ged i positioneringen af
teksterne,
> hvorfor?

Det virker heller ikke i Mozilla 1.4 på WinXP.

--
Mvh
Frederik Østeraa



Hans Lund (22-08-2003)
Kommentar
Fra : Hans Lund


Dato : 22-08-03 07:09

Erik Ginnerskov wrote:
> Hej NG
> Jeg fik en klage vedrørende www.hjemmesideskolen.dk/scripts/diastxt.asp
> gående på, at hvis siden sås i en full screen browser på 1280x1024 px,
> vistes teksten skævt i forhold til den beregnede plads.
>
> Forsøgte så med at sætte en relativ position på tabellen og derefter at
> positionere teksterne absolut i forhold til tabellen i stedet for
> browservinduets øverste venstre hjørne.
>
> Det virker fint i MSIE 5.5 og 6 og Opera 6.05 og 7.11, men i Mozilla 1.2.1
> og 1.3 og Netscape 6.2.3 og 7.0 går der ged i positioneringen af teksterne,
> hvorfor?
>
> Alt kører på W98SE. De gamle browsere kan kun testes i 800x600px, men de nye
> kan testes i op til 1280x1024px - på min maskinpark.
>
> Se forsøget her:
>
> www.hjemmesideskolen.dk/scripts/diastxt2.asp
>
Svært at sige uden eksemplet. Mozilla forsøger at overholde w3c css
standarden mht positionering, hvilket ikke er tilfældet for de andre.
Men hvad skal du i det hele taget bruge positionering til?????. Din
tekst står jo i en tabel cell; det eneste du skal 'sørge' for er at de
skjulte tekster ikke er med i flow layoutet ( og dermed rykker den viste
tekst). Så drop positionering og sæt display:none på divs der ikke skal
vises.


Erik Ginnerskov (22-08-2003)
Kommentar
Fra : Erik Ginnerskov


Dato : 22-08-03 13:59


"Hans Lund" <hal@statsxxbiblioteket.dk> skrev
> Svært at sige uden eksemplet. Mozilla forsøger at overholde w3c css
> standarden mht positionering, hvilket ikke er tilfældet for de andre.
> Men hvad skal du i det hele taget bruge positionering til?????. Din
> tekst står jo i en tabel cell; det eneste du skal 'sørge' for er at de
> skjulte tekster ikke er med i flow layoutet ( og dermed rykker den viste
> tekst). Så drop positionering og sæt display:none på divs der ikke skal
> vises.

Jeg tror ikke, du har forstået problematikken.

I tabellens nederste venstre celle vises en case-sensitiv tekst ved
onMouseOver på billederne. Teksten afhænger altså af, hvilket billede, der
peges på, men teksten skal under alle omstændigheder vises samme sted.

I www.hjemmesideskolen.dk/scripts/diastxt.asp er disse billedtekster
positioneret absolut i forhold til øverste venstre hjørne af browservinduet.
Det fungerer uden problemer i alle browsere, så længe teksten over tabellen
optager mindst fire linjer. Ved stor browserbredde sker der en forskydning
opad af tabellen, men af gode grunde ikke med billedteksterne.

Derfor forsøgte jeg i henhold til css-standarden at positionere tabellen
relativt - det skulle resultere i, at billedteksternes absolutte position
regnedes ud fra tabellens aktuelle øverste venstre hjørne.

Det virker fint i MSIE (jeg ved godt, det ikke er verdens bedste browser) og
i Opera, men i Mozilla og Netscape vises billedteksterne stadig i forhold
til browservinduets øverste venstre hjørne, nu bare med de ændrede
koordinater - dvs. helt ude af tabellen.

Se problemet i www.hjemmesideskolen.dk/scripts/diastxt2.asp

Og så kommer spørgsmålet: hvor i koden ligger fejlen, siden det ikke virker
efter hensigten i Mozilla og Netscape?

--
Med venlig hilsen
Erik Ginnerskov
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/egin



Jens Gyldenkærne Cla~ (22-08-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 22-08-03 14:32

Erik Ginnerskov skrev:


> I tabellens nederste venstre celle vises en case-sensitiv
> tekst ved onMouseOver på billederne. Teksten afhænger altså
> af, hvilket billede, der peges på, men teksten skal under alle
> omstændigheder vises samme sted.

Teksten skal med andre ord placeret absolut i forhold til tabellen.


> I www.hjemmesideskolen.dk/scripts/diastxt.asp er disse
> billedtekster positioneret absolut i forhold til øverste
> venstre hjørne af browservinduet. Det fungerer uden problemer
> i alle browsere, så længe teksten over tabellen optager mindst
> fire linjer. Ved stor browserbredde sker der en forskydning
> opad af tabellen, men af gode grunde ikke med billedteksterne.

Ved små browserbredder sker den omvendte forskydning - her rykker
billedteksten opad.


> Derfor forsøgte jeg i henhold til css-standarden at
> positionere tabellen relativt

Det ville jeg også have gjort.


> Det virker fint i MSIE (jeg ved godt, det ikke er verdens
> bedste browser) og i Opera, men i Mozilla og Netscape vises
> billedteksterne stadig i forhold til browservinduets øverste
> venstre hjørne, nu bare med de ændrede koordinater - dvs. helt
> ude af tabellen.

Et par eksperimenter viser at det er tabellens display-egenskab der
driller. Mozilla vil åbenbart kun acceptere position: relative;
hvis man sætter display: block;

Det giver et mindre, nyt problem - nemlig at tabellen bliver for
smal. Det er klassen t400 der sætter bredden 400px - og det er ikke
nok til at rumme alle billederne. Bredden bliver overridet når
tabellen har normal display-status (display: table;), men træder i
effekt når man sætter display: block;


Se eksempel her: <http://damu.dk/jc/usenet/diastext.shtml>.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Jens Gyldenkærne Cla~ (22-08-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 22-08-03 14:38

Jens Gyldenkærne Clausen skrev:

> Det giver et mindre, nyt problem - nemlig at tabellen bliver
> for smal.

Her burde jeg måske lige have skrevet at det er løst i det eksempel
jeg linkede til.

> Se eksempel her: <http://damu.dk/jc/usenet/diastext.shtml>.

Såvel display: block; og width: 550px; er sat på som inline style.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Erik Ginnerskov (23-08-2003)
Kommentar
Fra : Erik Ginnerskov


Dato : 23-08-03 00:56


"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev
>
> > Det giver et mindre, nyt problem - nemlig at tabellen bliver
> > for smal.
>
> Her burde jeg måske lige have skrevet at det er løst i det eksempel
> jeg linkede til.
>
> > Se eksempel her: <http://damu.dk/jc/usenet/diastext.shtml>.
>
> Såvel display: block; og width: 550px; er sat på som inline style.

Det skal jeg studere nærmere i morgen (når det bliver lyst). Jeg kan se, at
det kan lade sig gøre, også i Mozilla og også i 1280x1024. Det var bare min
kodning, der ikke var god nok

--
Med venlig hilsen
Erik Ginnerskov
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/egin



Søg
Reklame
Statistik
Spørgsmål : 177560
Tips : 31968
Nyheder : 719565
Indlæg : 6408942
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste