[css] vreemd probleem

[chris]

Ik kom er even niet helemaal uit

Ik heb een leuk design in photoshop gemaakt dat ik wil uitwerken in xhtml+css, maar ik zit nu even heel erg vast. Aangezien een plaatje meer zegt dan duizend woorden:

http://as.spugium.net/flipke/locatie.png

Dat grijze wordt 100% breed van het venster, dat zwarte is een span die rechts float, en die "locatiebalk" moet dus niet een tekstarea worden maar een div/span die de rest uitvult. Nu zou ik denken: maak er een span van, zet die op display:inline en width: 100%, en met de juiste left/right margin moet dat heel mooi gaan. Dit werkt dus helaas niet, en ook door 'm te floaten werkt het niet, kan iemand me even een zetje in de goede richting geven? Ik hoef geen explicitie code

[André]

En met de juiste padding ipv margin?

[chris]

Nou, dat is het niet. Ik krijg 'm er wel naast, door 'm op display: inline te zetten, maar dan trekt moz zich niets aan van de width property. en door op display:block te zetten zet ie 'm automatisch ónder "Lokatie: "

[chris]

Ok, het is me gelukt door ze in aparte spans te plaatsen en allebei op float: left te zetten, zie ook http://as.spugium.net/flipke/got/template.html

Helaas zit ik nu weer met een ander probleem. Het werkt niet in ie. De "lokatie: " span en de adres-span staan in mozilla perfect naast elkaar, maar in ie gaan ze onder elkaar staan. Iemand enig idee hoe dat komt?

[disjfa]

Waarom zet je de span met de datum buiten de div met de pagina`s waar je deze dan gemakkelijk rechts kan laten floaten in zetten?

HTML:

<div id="location">
  <span class="title">Lokatie: </span>
  <span class="path">/<a href="#">home</a>/<a href="#">page 1</a>/page 2</span>
  
  <span id="date">maandag 2 augustus 2004</span>
</div>

[chris]

disjfa schreef op 02 augustus 2004 @ 15:04:
Waarom zet je de span met de datum buiten de div met de pagina`s waar je deze dan gemakkelijk rechts kan laten floaten in zetten?

HTML:

<div id="location">
  <span class="title">Lokatie: </span>
  <span class="path">/<a href="#">home</a>/<a href="#">page 1</a>/page 2</span>
  
  <span id="date">maandag 2 augustus 2004</span>
</div>

omdat.......
ik eerst die date ging laten floaten en later pas met de location bezig ging....best dom eigenlijk

maar gewoon een kwestie van volgorde.

[disjfa]

als jij het een volgorde issue vind... mag best.

Cascading Stylesheet:

#date {
  text-align: center;
  width: 234px;
  display:block;
  position:absolute;
  height: 22px;
  top: 50px;
  right:0;
  background: url("http://as.spugium.net/flipke/got/img/date_back.png");
  color: #fff;
}

Is niet al te ingewikkeld. Niet alles hoeft te floaten. Soms mag een absoluut gepositioneerd dingetje wel.

[ Voor 4% gewijzigd door disjfa op 02-08-2004 15:50 ]