[css] n00b menubox vraagje - Softwareontwikkeling

vrijdag 19 september 2003 15:11

Acties:

Fighting entropy since 1970

Topicstarter

Goeie,

Ik probeer een menudoosje rechts van de hoofdtekst te plaatsen. Ik probeer dat nu zo:

Cascading Stylesheet:

body {
margin: 2% 30% 0 20%;
background-color: #005fb7;
}

#textbox {
text-align: left;
margin: 0;
padding: 0 1em 0 1em;
border: 2px black solid;
background-color: #ffffff;
}

p {
background-color: #ffffff;
}

#menubox {
background-color: #ffffff;
border-style: solid none solid none;
border-width: 2px 0 2px 0;
width: 11em;
margin: 0;
float: right;
display: block;
}

... en html body part:

HTML:

<body>
<center><img src="jvdberg3.png" alt="Top part of Mt Everest, this being a pun on my last name..." /></center>
<div id="textbox">
<p>Dit is een test</p>
<p>Dit ook.</p>
<p>Dit ook.</p>
<p>Dit ook.</p>
<p>Dit ook.</p>
</div>

<div id="menubox">
<p>Dit is een test</p>
<p>Nog een</p>
</div>
</body>

Het probleem is nu dat de menubox *onder* de textbox verschijnt, ipv ernaast. Het zal wel iets simpels zijn, maar ik zie het niet. Iemand? $_/-\o_$

[ Voor 16% gewijzigd door crisp op 19-09-2003 15:30 . Reden: code tags ]

What use is a man walking on water if you don't follow in his footsteps?

vrijdag 19 september 2003 15:13

Acties:

kleautviool

margin: 0; moet margin: 0px; worden.

vrijdag 19 september 2003 15:14

Acties:

Hoppie

Je moet ze natuurlijk wel positioneren!
Kijk 's naar css position div.

vrijdag 19 september 2003 15:14

Acties:

OnTracK

DIV is sowieso als een block-object, en je hebt het bij #menubox ook nog eens handmatig erbij gezet.

probeer eerst maar eens die "display: block;" in "display: inline;" te veranderen en anders ook nog een style'tje voor je DIV aanmaken met daarin ook "display: inline"

Not everybody wins, and certainly not everybody wins all the time.
But once you get into your boat, push off and tie into your shoes.
Then you have indeed won far more than those who have never tried.

vrijdag 19 september 2003 15:19

Acties:

Willem

display inline?

Verder ff [ code ] && [ /code] meuk gebruiken voor het overzicht....

Motor (of auto) onderhoud bijhouden

vrijdag 19 september 2003 15:48

Acties:

LePlatDuJour

Fighting entropy since 1970

Topicstarter

Hmm... ik heb nu

code:

#menubox {
background-color: #ffffff;
border: 2px black solid; 
width: 11em;
padding: 1em;
margin: 0;
position: absolute;
top: 2em;
left: auto;
right: 2em;
}

en dat zet 'm wel rechtsboven, buiten de normale tekst, maar ik krijg de bovenkant nu niet mooi gelijk me de bovenkant van de normale tekst..

display:inline gaf geen resultaat. Nog meer suggesties?

[ Voor 3% gewijzigd door LePlatDuJour op 19-09-2003 15:58 . Reden: Mmm.. code tags? ]

What use is a man walking on water if you don't follow in his footsteps?

woensdag 24 september 2003 19:22

Acties:

Hoppie

LePlatDuJour schreef op 19 September 2003 @ 15:48:
Hmm... ik heb nu
code:
1
2
3
4
5
6
7
8
9
10
11
#menubox {
background-color: #ffffff;
border: 2px black solid; 
width: 11em;
padding: 1em;
margin: 0;
position: absolute;
top: 2em;
left: auto;
right: 2em;
}
en dat zet 'm wel rechtsboven, buiten de normale tekst, maar ik krijg de bovenkant nu niet mooi gelijk me de bovenkant van de normale tekst..

display:inline gaf geen resultaat. Nog meer suggesties?

Misschien een beetje spelen met de waarde voor top? Misschien in px in plaats van em?

woensdag 24 september 2003 19:24

Acties:

Verwijderd

kleautviool schreef op 19 september 2003 @ 15:13:
margin: 0; moet margin: 0px; worden.

Voor de database: dit is niet waar.
Bij een waarde van nul mag je de eenheid weglaten. Nul centimeter is ook nul inches.

donderdag 25 september 2003 04:12

Acties:

Cresso

zet zowel in #textbox als #menubox:

code:

1	float: left;