[XHTML] irritante horizontale schuifbalk

Pagina: 1
Acties:

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
Ik ben pas bezig geweest om een aantal pagina's om te zetten van HTML naar XHTML. Bij pagina's die met frames werken krijg ik nu echter overbodige horizontale schuifbalken te zien.

Zie voorbeeld

Dit treedt op zodra de inhoud van die pagina niet meer past en er dan een vertikale schuifbalk bij komt. (so far so good). Het probleem is dat er op dat moment tevens een horizontale schuifbalk bij komt. En het lijkt er op dat die bedoeld is om het stukje wat onder te vertikale balk zit weer te kunnen weergeven. 8)7

Als ik ipv XHTML "gewoon" HTML gebruik heb ik hier geen last van.

Is dit een bug van Explorer ofzo? En hoe los ik het op?

  • momania
  • Registratie: Mei 2000
  • Laatst online: 08:51

momania

iPhone 30! Bam!

Is dit niet gewoon een kwestie van de scrolling parameter invullen bij je frame tag :?

Neem je whisky mee, is het te weinig... *zucht*


  • Woudloper
  • Registratie: November 2001
  • Niet online

Woudloper

« - _ - »

Ik denk dat momanie gelijk heeft, want als ik je pagina van het onderste frame los open zie ik geen horizontal scrollbar.

Verwijderd

Tsja, Hoe ziet je frame set eruit....

  • André
  • Registratie: Maart 2002
  • Laatst online: 26-05 00:33

André

Analytics dude

Zo ziet zijn frameset er uit (view source mensen).
HTML:
1
2
3
4
5
6
7
8
9
10
<frameset rows="50,*">
  <frame src="test_h.htm" name="head" title="Navigation bar" />
  <frame src="test.htm" name="test" title="Content" scroll="auto"/>
  <noframes>
    <body>
    <p>Your browser doesn't seem to support frames. </p>
    <a href="test.htm" target="_top">Press here to continue...</a>
    </body>
  </noframes>
</frameset>

PS. Ik heb scroll="auto" toegevoegd.

Als je de url uit je doctype haalt kan het probleem ook wel eens opgelost zijn.

[ Voor 41% gewijzigd door André op 31-12-2003 11:23 ]


Verwijderd

misschien scroll no ???

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
Dit lijkt niet te werken. Ik zie nog steeds beide balken.

Verwijderd

Verwijderd schreef op 31 december 2003 @ 11:16:
Tsja, Hoe ziet je frame set eruit....
Zie z'n voorbeeld...

Gokje, haal die anchors is weg en zet die 'id' attributen gewoon op het 'p' element. Werkt exact hetzelfde namelijk.

Daarnaast nog wat dingen:
  • target=_top in de framesetpagina?
  • Een hoop presentatie elementen in je topframe (niet veel beter dan HTML...)
  • Wellicht werkt het wel in quirks mode? (<!-- --> boven de doctype zetten)
Dit heeft trouwens niks te maken met scrolling instellen in de frameset AFAIK.

Nog een vraag: gebruikte je VALID html, quirks/geen quirks etc. Kan me namelijk niet echt voorstellen dat IE onderscheid maakt tussen HTML en XHTML...

[ Voor 15% gewijzigd door Verwijderd op 31-12-2003 11:26 ]


  • momania
  • Registratie: Mei 2000
  • Laatst online: 08:51

momania

iPhone 30! Bam!

hneel schreef op 31 december 2003 @ 11:24:
[...]


Dit lijkt niet te werken. Ik zie nog steeds beide balken.
attribuut dat je moet zetten is 'scrolling' en dan vullen met 'no' om ze weg te laten

dus:
HTML:
1
<frame src="test.htm" name="test" title="Content" scrolling="no"/>

Neem je whisky mee, is het te weinig... *zucht*


  • Woudloper
  • Registratie: November 2001
  • Niet online

Woudloper

« - _ - »

hneel schreef op 31 december 2003 @ 11:24:
Dit lijkt niet te werken. Ik zie nog steeds beide balken.
Wellicht moet je dan de andere suggestie volgen, door het scroll="no" te zetten.

Verwijderd

Kom op, dat scroll="no"/scrolling="no" gaat nergens over. Als je ook maar 1 keer met frames gewerkt hebt, weet je dat het daar niet aan ligt.

[ Voor 10% gewijzigd door Verwijderd op 31-12-2003 11:28 ]


  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
Ik heb het: scrolling="yes"

bij "no" zie ik geen balken, bij "auto" zie ik er twee.
En bij "yes" alleen de vertikale, en dat is precies wat ik wil.

Bedankt voor de hulp, allemaal!

(voorbeeld is bijgewerkt)

[ Voor 20% gewijzigd door hneel op 31-12-2003 11:30 ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 26-05 00:33

André

Analytics dude

Verwijderd schreef op 31 december 2003 @ 11:27:
Kom op, dat scroll="no"/scrolling="no" gaat nergens over. Als je ook maar 1 keer met frames gewerkt hebt, weet je dat het daar niet aan ligt.
inderdaad, dan zou je nooit meer een scrollbalk krijgen en dat is ook niet de bedoeling.

  • momania
  • Registratie: Mei 2000
  • Laatst online: 08:51

momania

iPhone 30! Bam!

André schreef op 31 december 2003 @ 11:30:
[...]

inderdaad, dan zou je nooit meer een scrollbalk krijgen en dat is ook niet de bedoeling.
Ik was even in de war, dacht dat de TS helemaal geen scrollbars wilde 8)7

Neem je whisky mee, is het te weinig... *zucht*


  • Woudloper
  • Registratie: November 2001
  • Niet online

Woudloper

« - _ - »

Anne, je hebt helemaal gelijk. Maar het is alweer een tijdje geleden dat ik gebruik heb gemaakt van frames, dus vandaar. Ik denk dat de TP'er eigenlijk gewoon jouw suggesties in acht moet nemen en niet voor de optie: scrolling="yes" gaan.

Helemaal OK zou ik het vinden (maar dat ben ik) als hij geen gebruik meer maakt van frames. Persoonlijk gebruik ik ze niet meer aangezien het merendeel van wat je met frames kan doen ook gewoon kan doen door goed gebruik te maken van CSS.

  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

volgens mij kan je zelfs beter het scrolling attribuut helemaal weglaten en in je pagina's zelf overflow:auto zetten op de body - voor zover ik weet zou dat ook het gewenste effect moeten hebben.

[ Voor 3% gewijzigd door crisp op 31-12-2003 11:44 ]

Intentionally left blank


  • Roeland4
  • Registratie: Januari 2002
  • Laatst online: 09-02 19:33
Ik zie eigenlijk helemaal geen horizontal scrollbar??
Moet wel zeggen dat ik mozilla firebird gebruik.

  • Woudloper
  • Registratie: November 2001
  • Niet online

Woudloper

« - _ - »

Roeland4 schreef op 31 december 2003 @ 11:48:
Ik zie eigenlijk helemaal geen horizontal scrollbar??
Moet wel zeggen dat ik mozilla firebird gebruik.
Klopt, want de TP'er heeft zoals hij hier beschreef in het online voorbeeld het probleem opgelost, vandaar dat je het niet meer ziet.

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
Roeland4 schreef op 31 december 2003 @ 11:48:
Ik zie eigenlijk helemaal geen horizontal scrollbar??
Moet wel zeggen dat ik mozilla firebird gebruik.
Erhm, ik had hem al bijgewerkt. :o

Ik heb de oude weer even terug gezet en de nieuwe in een apart filetje gezet:

oud

nieuw

Verwijderd

Mocht je met frames en XHTML willen doorgaan, lees even dat rijtje tips door dat ik gegeven heb. Anders is deze misschien wel interessant: http://limpid.nl/lab/css/fixed/h

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
Verwijderd schreef op 31 december 2003 @ 12:10:
Mocht je met frames en XHTML willen doorgaan, lees even dat rijtje tips door dat ik gegeven heb. Anders is deze misschien wel interessant: http://limpid.nl/lab/css/fixed/h
Dat laatste ziet er inderdaad wel cool uit. Ik denk dat ik me daar eens in ga verdiepen. Dan heb ik die frames niet meer nodig.

Ik wil sowieso meer over DIV's gaan leren. Nu doe ik nog een hoop met onzichtbare tables, maar dat is ook niet echt een nette manier van werken.

Verwijderd

Ik denk dat je beter CSS kunt leren dan iets over <div/> ;-). Dat zijn namelijk gewoon block-level elementen zonder een default style (behalve display:block;), hetzelfde geld voor <span/> (display:inline;).

<span/> is eigenlijk nooit nodig, behalve voor een paar dingetjes die IE af en toe niet ondersteund of dingen waarvoor geen structureel element voor handen is.

<div/> wordt meestal gebruikt om een pagina in te delen in logische secties. Ook van deze heb je er maar een minimaal aantal nodig. Heel vaak gebruiken mensen deze voor alles terwijl ze voor bijvoorbeeld de navigatie best afkunnen met <ul id="nav"/> en voor de footer met <p id="footer"/>. Die elementen hebben uiteraard wel wat default style, maar die kun je overschrijven en dan zijn het gewoon <div/> elementen die je overal voor kunt gebruiken.

  • bakakaizoku
  • Registratie: Januari 2002
  • Laatst online: 22:25
wat ik mij nog kan herinneren van een site @ stage (vakantie, dus kan niet checken nu :P), was dit simpel op te lossen door ipv xhtml1.0, xhtml1.1 te gebruiken..

afaik

rm -rf ~/.signature


  • André
  • Registratie: Maart 2002
  • Laatst online: 26-05 00:33

André

Analytics dude

mattttt schreef op 31 december 2003 @ 13:18:
wat ik mij nog kan herinneren van een site @ stage (vakantie, dus kan niet checken nu :P), was dit simpel op te lossen door ipv xhtml1.0, xhtml1.1 te gebruiken..

afaik
Moet je ook even de draad lezen, dan zie je dat de oplossing al lang geweest is.

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
http://www.xs4all.nl/~hneel/test2.htm

Nu zonder frames! 8)


Alleen is nu de font-size groter geworden. Dat kan ik weer oplossen door de volgende regel in mijn .css file te zetten. Maar is dat geen frats-manier?
Cascading Stylesheet:
1
DIV       { font-size: smaller; }   

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
edit:
dubbelpost

[ Voor 137% gewijzigd door hneel op 31-12-2003 14:21 ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 26-05 00:33

André

Analytics dude

Je kunt er ook dit in zetten:

Cascading Stylesheet:
1
2
3
DIV { font-size: 10pt; }
DIV { font-size: 10em; }
DIV { font-size: 10px; }

  • hneel
  • Registratie: Maart 2001
  • Nu online

hneel

denkt er het zijne van

Topicstarter
Ik zie het al: het komt door die regel bovenin het document:
HTML:
1
<?xml version="1.0" encoding="utf-8"?>


Deze is nodig om dat met die fixed header mogelijk te maken.
Maar als neven-effect verhoogt hij alle font-sizes in het document. :?

Oplossing: Een "font-size: smaller;" in de body style declaratie van het document.

[ Voor 8% gewijzigd door hneel op 31-12-2003 14:31 ]


Verwijderd

Vervang dat ding bovenin met <!-- -->. Het lost niet je probleem op, maar het is meer cross-browser ;-). Houdt er rekening mee dat IE6.0 in quirks mode staat, omdat er iets voor de DOCTYPE geplaatst is.

Verwijderd

zo, effe een kleine kick, ik heb namelijk hetzelfde probleem, alleen de aangedragen oplossingen (scrolling="yes"; geen frames gebruiken) is voor mij geen optie

samenvattend de situatie: ik heb een xhtml frameset, als een document langer is dan de viewport komt er een verticale en een horizontale scrollbar bij in ie. Die horizontale moet dus sowieso niet en de verticale alleen als nodig

- url uit doctype is geen oplossing
- scrolling="yes" is een oplossing, maar dat levert altijd een verticale scollbar, overflow:auto extra in de body css brengt het probleem weer terug
- alleen overflow: auto lost het ook niet op (op de body of op de html)
- een niet xhtml frameset geeft hetzelfde probleem
- de (xhtml) pagina uit het frameset werkt correct
- de betreffende pagina (niet de frameset) in ie quirks mode geeft het probleem niet, maar dat levert me weer boxmodelverschillen op

[ Voor 10% gewijzigd door Verwijderd op 31-03-2004 19:30 ]


Verwijderd

Box model verschillen zijn makkelijk omheen te werken. Als je IE6 in quirks mode hebt is dat alleen maar makkelijker (simpele child selector). Wat is het probleem?

  • Eärendil
  • Registratie: Februari 2002
  • Laatst online: 04:18
edit:
niet gezien dat dit een kick was (alleen eerste pagina gelezen) |:(

[ Voor 80% gewijzigd door Eärendil op 01-04-2004 13:05 ]


Verwijderd

de boel in quirksmode doen en om boxmodelverschillen heen werken vind ik geen oplossing

ik heb nu voor ie de overflow op auto gezet en de height op 100% en vervolgens die weer op auto gezet voor moz door de direct child selector. Ook geen nette oplossing, maar wel een betere imho

Verwijderd

IE is sowieso al een quirky browser. Ik zie het probleem niet zo.
edit:
Merk dus op dat alle andere browsers wel de 'standard compliant mode' hanteren.

[ Voor 42% gewijzigd door Verwijderd op 01-04-2004 15:47 ]


  • _Jeffrey_
  • Registratie: Maart 2003
  • Niet online
Het gaat hier waarschijnlijk om de 'horizontale schuifbalk bug'. Als oplossing wordt ook een tweak met overflow gebruikt, maar net iets anders.
Volgende code verlost ons van de horizontale schuifbalken in IE5+/WIN:
code:
1
2
3
4
5
6
7
<style type="text/css">
<!--
html {
    overflow-x: hidden;
} 
-->
</style>
Als je deze code in je webdocument plaatst zal je zien dat de horizontale schuifbalk inderdaad verdwijnt. Maar dat de tekst die vroeger zichtbaar was dankzij de horizontale schuifbalk, nu verdwenen is. Andere waarden voor de overflow-x eigenschap helpen je geen stap verder. Om een of andere bizarre reden moeten we de hulp van de overflow-y eigenschap inroepen. Dit stukje code geeft ons precies wat we willen; weg horizontale schuifbalken en alle inhoud is zichtbaar.
code:
1
2
3
4
5
6
7
8
<style type="text/css">
<!--
html {
    overflow-x: hidden;
    overflow-y: auto;
} 
-->
</style>
Pagina: 1