[HTML] Div horizontale scrollbalk

[Verwijderd]

Ik heb onderstaande code ...
alles werkt goed, de bedoeling is dat er een boel kleine foto's naats elkaarkomen te staan waardoor je horizontaal heen kan scrollen. Qua ontwerp wil ik dat de scrollbalk onderaan de layer tegen het plaatje aankomt, deze heeft nu een margin van 3 pixels.

code:

    <div id='fotoviewerText' style='position:relative; left:13; top:25px; width:746px; height:65px; z-index:2; overflow-x:scroll; overflow-y:none; border:1px; padding-bottom:0px; padding-left:0px; padding-top:0px'>
        [img]"images/test.jpg"[/img]
    </div>

[Willem]

Doe anders even een screenshot, of nog beter, een URL waar je de meuk hebt geupload, kunnen we beter kijken

_{En voortaan je verhaaltje even afbreken met harde returns als je 'code' zo lang is zeg maar.
Dit lees heel vervelend}

[Verwijderd]

http://www2.hku.nl/~patrick/test/

[Willem]

[Verwijderd]

ja die scrollbalk moet dus zeker 3 pixels omhoog; de scrollbalk moet precies de onderkant raken van het plaatje. Ik kan dan straks mbv. de hoogte van de layer wel de scrollbalk goed in positie brengen. Het gaat dus erom dat de scrollbalk precies de onderkant raak van het plaatje. Met een iframe lukte mij dit ook al niet., daar kreeg ik een hele mooie verticale scrollbalk erbij.

[Willem]

Zet dit eens in je CSS:

code:

   <style type="text/css">
    .melp {
      position:relative;
      left:13px;
      top:25px;
      width:746px;
      height:65px;
      z-index:2;

      overflow-x:scroll;
      overflow-y:none;
      border:1px solid #000000;
      border-collapse:collapse;

      padding-bottom:0px;
      padding-left:0px;
      padding-top:0px;
      
      margin:0px 0px 0px 0px;
      text-align:left;
      vertical-align:top;
    }
    </style>

En dit in je HTML:

code:

<div id="fotoviewerText" class="melp">
    [img]"images/test.jpg"[/img]
</div>

Lost dit al iets op?

_{Note: Heb e.e.a toegevoegd, en even in de CSS geplempt, dat is stukken overzichtelijker}

[Verwijderd]

ja ok, dat was ik ook nog van plan, maar doe liever eerst alles in een stylesheet in de pagina zelf. Maar het heeft niks geholphen btw. ... check de site ...
overigens de stylesheet staat op data/stylesheet.css ...maar dat had je zelf denk ik ook al uitgevogeld

[Willem]

OK, en in de body van de pagina

code:

margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;

en in de en td tag in de CSS

code:

td {
  border-collapse:collapse;
  margin:0px 0px 0px 0px;
  padding:0px 0px 0px 0px;
}

Vooral die laaste, wat gebeurt er?

[Morrar]

Ok, wellicht is dit te simpel, maar ben je niet vergeten dat er met Javascript nog een layer/div omheen gezet wordt?

De code wordt dan (ongeveer):

<div id='fotoviewer' style='position:absolute; left:0px; top: 0px; width:776px; height:123px; background-image:url(http://www2.hku.nl/~patrick/test/images/fotoviewer.gif); z-index:1'>

<div id='fotoviewerText' class='melp'>
[img]"images/test.jpg"[/img]
</div>

</div>

Als ik dat hier test krijg ik hetzelfde als het plaatje...

Was dat t?

Suc6

[Verwijderd]

Javascript zorgt voor die eerste layer waarin de tweede genest zit, dus dat zit wel goed. Ook de margin etc. in de CSS helpen niet, ik begin me toch echt af te vragen of dit wel mogelijk is

[simon]

Off-topic:

Ik zie geen scrollbalk in mozilla.

[Verwijderd]

omdat de site totaal NIET crossbrowser is, en dat hoeft het ook niet. Uiteindelijk zal het draaien op een netwerk met alleen maar IE!!! ...