[CSS] Fixed Element met dynamische hoogte

Pagina: 1
Acties:

  • wboard
  • Registratie: Juli 2002
  • Laatst online: 04-04-2022

wboard

-=<wboard>=-

Topicstarter
Ik heb een CSS probleem, ik heb een div element gefixt op een pagina staan. Het element overlapt
de hele webpagina, alleen zodra de hoogte van de div groter wordt dan de schermhoogte, worden er geen scrollbars zichtbaar en kun je niets meer doen. Ik heb het getracht op te lossen met overflow-y: scroll;, maar dat werkt niet.

Het enige wat werkt is om de fixed div een bepaalde hoogte te geven, bijvoorbeeld 100px;. Dan zijn de scrollbars wel zichtbaar.

Enig idee of hier een goede oplossing voor is, ik heb op internet niets hierover gevonden.

A smooth sea never made a skilled sailor


Verwijderd

Je kunt iets met max-height proberen, of een element fixed positioneren met 100% height, en daarin je content zetten. Verder is dat natuurlijk de vloek van het absoluut of fixed positioneren. Je bent een hoop referentiepunten kwijt.

  • wboard
  • Registratie: Juli 2002
  • Laatst online: 04-04-2022

wboard

-=<wboard>=-

Topicstarter
max-height, werkt natuurlijk niet, want height moet afhankelijk zijn van de browser grootte (in de hoogte). Ik heb nu een aparte div gemaakt, met height: 100% en dan lijkt te werken, ik had eerst nl.
meerdere divs binnen een div. Ik post de code wanneer het werkt, bedankt voor de tip.

A smooth sea never made a skilled sailor


  • wboard
  • Registratie: Juli 2002
  • Laatst online: 04-04-2022

wboard

-=<wboard>=-

Topicstarter
ik heb één groot probleem er bij gekregen, nu ik dit werkend heb gekregen

dit is wat ik heb om een div in zowel IE en firefox static/fixed aan de bovenzijde van je scherm te krijgen:
code:
1
2
3
<div id="fixAdminData">
    <div id="adminData"></div>
</div>

css:
Cascading Stylesheet:
1
2
3
4
5
6
7
8
9
10
11
12
13
#fixAdminData 
{
    height: 100%; border: 1px solid black;
    position: absolute; top: 0; left: 0; z-index: 2; 
    overflow-x: hidden; overflow-y: auto;
}

div#adminData
{
    height: 100%;
    display: none;
    background: url(../../../images/1/backgrounds/admin.jpg) bottom right no-repeat white; 
}


het probleem wat ik nu krijg is dat ik geen cursor zie in firefox (bij invoervelden). Dit is een bekende bug en op te lossen door #fixAdminData -> overflow-y: hidden; Echter wanneer adminData dan
groter wordt dan je actuele scherm, krijg je geen scrollbars, wat mijn eerdere probleem was.

Iemand enig idee hoe dit op te lossen is?

A smooth sea never made a skilled sailor


  • wboard
  • Registratie: Juli 2002
  • Laatst online: 04-04-2022

wboard

-=<wboard>=-

Topicstarter
kick :/ it

[ Voor 17% gewijzigd door wboard op 09-03-2007 21:00 ]

A smooth sea never made a skilled sailor


  • wboard
  • Registratie: Juli 2002
  • Laatst online: 04-04-2022

wboard

-=<wboard>=-

Topicstarter
kick, weet niemand iets ? want dan moet ik met javascript gaan kloten 8) :'(

A smooth sea never made a skilled sailor

Pagina: 1