[CSS] voor dummies - deel 12

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_69624304
Merci heren, ook het clear in de footer zetten werkt ook. Je moet het allemaal net weten, ik spreek ook krom spaans. het werkt, je krijgt wat je wilt (cq. mijn gasten krijgen wat ze willen) maar mooi is het niet. Zo ook mijn kennis van CSS. Nogmaals bedankt...
De wijze houdt zich op de achtergrond, in werkelijkheid staat hij vooraan
pi_69788993
1px Offset

Ik heb nu iets irritants. Ik heb een bg, die gecentered word door background-position:center (het is in de body, zodat ik een height: 100% heb). Ook heb ik een top van een vlak, met rounded corners, gecentered doormiddel van margin: 0 auto; . Als ik mijn firefox/ie/w/ever (het komt overal voor) resize, laat het ding 2 situaties zien. De goede:


en dan de slechte, als ik mijn venster resize:


Hoe ga ik dit tegen?
pi_69789030
ik neem aan dat je bovenste ding uit 1 plaatje bestaat ? je kan een min-length of min-width instellen
zodat hij niet kleiner word dan dat plaatje wat je boven aan hebt gebruikt
1min-width: 800px;


dit ter behoeve aan de breedte kijk hoe breed het plaatje is en stel het in ?

hierdoor heb je altijd de gewenste grootte is het beweegbaar in de breedte als het langer word.
maar houd het een absolute waarde aan als het kleiner is dan 800px.

vertel het me als het zo is opgelost

[ Bericht 50% gewijzigd door cablegunmaster op 07-06-2009 11:38:54 ]
Redacted
pi_69789380
quote:
Op zondag 7 juni 2009 11:27 schreef cablegunmaster het volgende:
ik neem aan dat je bovenste ding uit 1 plaatje bestaat ? je kan een min-length of min-width instellen
zodat hij niet kleiner word dan dat plaatje wat je boven aan hebt gebruikt
[ code verwijderd ]

dit ter behoeve aan de breedte kijk hoe breed het plaatje is en stel het in ?

hierdoor heb je altijd de gewenste grootte is het beweegbaar in de breedte als het langer word.
maar houd het een absolute waarde aan als het kleiner is dan 800px.

vertel het me als het zo is opgelost
Dat is t probleem niet denk ik. Zelfs als het scherm groot zat is doet het een beetje raar. Demo op http://joristimes.nl/kutje/
pi_69789500
quote:
Op zondag 7 juni 2009 11:45 schreef Flaccid het volgende:

[..]

Dat is t probleem niet denk ik. Zelfs als het scherm groot zat is doet het een beetje raar. Demo op http://joristimes.nl/kutje/
merk er niks van in FF
*test in IE *
Redacted
pi_69789702
quote:
Op zondag 7 juni 2009 11:51 schreef cablegunmaster het volgende:

[..]

merk er niks van in FF
*test in IE *
Huh? Tijdens dat je je schermpje resizen zie ik mijn top ding niet align met mn body bg
pi_69790030
quote:
Op zondag 7 juni 2009 12:01 schreef Flaccid het volgende:

[..]

Huh? Tijdens dat je je schermpje resizen zie ik mijn top ding niet align met mn body bg
/* ignore 2 plaatjes kunnen niet in 1 div class
weet ik , probeer de top en middle eens in 1 div te doen ?
je kan het makkelijk in 1 css gedeelte maken
*/

Oplossing 1:
https://developer.mozilla.org/en/CSS/-moz-border-radius


zie voorbeeld
je kan het makkelijk zelf na maken


Oplossing 2:
maar om het probleem in IE op te lossen eens kijken

wat ik meestal doe is :
container maken Deze zet je in het midden neer en daar komt je webpagina in
1
2
3
4
5
6		<div class ="container">
<div class="contenttop">
</div>
<div class="body">
</div>
</div>


De CSS:
Container : in het midden centreren
Contenttop: (zit al in het midden door container) + plaatje
body: plaatje

?

[ Bericht 12% gewijzigd door cablegunmaster op 07-06-2009 12:25:59 ]
Redacted
pi_69790228
quote:
Op zondag 7 juni 2009 12:14 schreef cablegunmaster het volgende:

[..]

weet ik , probeer de top en middle eens in 1 div te doen ?
je kan het makkelijk in 1 css gedeelte maken


https://developer.mozilla.org/en/CSS/-moz-border-radius


zie voorbeeld
je kan het makkelijk zelf na maken
Met middle bedoel je het witte vlak? Dat zit vast aan de body, vanwege 100% height.
pi_69790272
quote:
Op zondag 7 juni 2009 12:23 schreef Flaccid het volgende:

[..]

Met middle bedoel je het witte vlak? Dat zit vast aan de body, vanwege 100% height.
negeer dat maar even, je hebt 2 verschillende plaatjes , dan komt dat niet goed uit.
oplossing 1:
borders recreeren met kleuren en stylen en er een randje aangeven met CSS
oplossing 2:
je vak in een container stoppen (andere klasse)
en de container centreren. en in de container alle andere divs instoppen.
Redacted
pi_69790384
quote:
Op zondag 7 juni 2009 12:24 schreef cablegunmaster het volgende:

[..]

negeer dat maar even, je hebt 2 verschillende plaatjes , dan komt dat niet goed uit.
oplossing 1:
borders recreeren met kleuren en stylen en er een randje aangeven met CSS
oplossing 2:
je vak in een container stoppen (andere klasse)
en de container centreren. en in de container alle andere divs instoppen. ^O^
Dat 2e komt in de buurt. van wat ik wil, maar nog niet helemaal. Ik heb besloten om de onderkant ook maar een randje te geven, zodat de 100% height niet per sé hoeft. Nog een kort css vraagje:

Ik heb nu deze code, ik dacht slim te zijn:
1
2
3
4
5
6
7
8
9
10
11
12
13
14		#contentend{
margin: 0 auto;
width: 800px;
height: 17px;
background-repeat:no-repeat;
}

#top{
background-image:url(img/contenttop.png);
}

#bottom{
background-image:url(img/contentbottom.png)
}

En dat ik dan de bovenste div 2 id's gaf, maar dat kan niet ofwel? Hoe moet het dan?
pi_69790426
quote:
Op zondag 7 juni 2009 12:28 schreef Flaccid het volgende:

[..]

Dat 2e komt in de buurt. van wat ik wil, maar nog niet helemaal. Ik heb besloten om de onderkant ook maar een randje te geven, zodat de 100% height niet per sé hoeft. Nog een kort css vraagje:

Ik heb nu deze code, ik dacht slim te zijn:
[ code verwijderd ]

En dat ik dan de bovenste div 2 id's gaf, maar dat kan niet ofwel? Hoe moet het dan?
welke html code gebruikte je?
kun je verduidelijken wat je bedoelt?

want Classes kun je herhaalt gebruiken en ID's niet
Redacted
pi_69790572
quote:
Op zondag 7 juni 2009 12:30 schreef cablegunmaster het volgende:

[..]

welke html code gebruikte je?
kun je verduidelijken wat je bedoelt?

want Classes kun je herhaalt gebruiken en ID's niet
Dat dus. Classes werken nu:)
pi_69847207
http://cablegunmaster.nl/test/index.html

Eigen vraag ik heb 2 plaatjes hoe krijg je het wit gedeelte er tussen weg ?
ik kan de spatie / wit nsb gedoe niet vinden.
Redacted
pi_69847328
quote:
Op maandag 8 juni 2009 23:31 schreef cablegunmaster het volgende:
http://cablegunmaster.nl/test/index.html

Eigen vraag ik heb 2 plaatjes hoe krijg je het wit gedeelte er tussen weg :P ?
ik kan de spatie / wit nsb gedoe niet vinden. :o
Verander
1
2		            <a href="" ><img src="knop_1_test.png" alt ="HOME" ></a>
            <a href="" ><img src="knop_2_test.png" alt ="OVER MIJ"></a>


eens door
1            <a href="" ><img src="knop_1_test.png" alt ="HOME" ></a><a href="" ><img src="knop_2_test.png" alt ="OVER MIJ"></a>
fokstok.nl
pi_69847384
quote:
Op maandag 8 juni 2009 23:34 schreef Light het volgende:

[..]

Verander
[ code verwijderd ]

eens door
[ code verwijderd ]
met zijn 2en zo'n beginners fout niet kunnen uitvogelen
ik hem al helpen met zijn css voor de border
hij creert natuurlijk een wit spatie en na 1 witspatie negeert hij de komende .


Hartelijk bedankt, iets om te lachen gevonden .
Redacted
pi_70389320
2 dingen.

1: Waarom is dit geen centraal topic? Ik moet m elke keer uit MyAt halen :(

2: Een simpel vraagje.

Ik heb een lijstje met tabs (een horizontal list)
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
En wat HTML code.
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
Nu wil ik bij de active geen background-image hebben aan de onderkant. Een class meegeven met background-image: none werkt niet. Wat doe ik verkeerd?
pi_70389927
quote:
Op vrijdag 26 juni 2009 11:10 schreef Flaccid het volgende:

Nu wil ik bij de active geen background-image hebben aan de onderkant. Een class meegeven met background-image: none werkt niet. Wat doe ik verkeerd?
Probeer "background: transparent" eens? En anders even in Firebug kijken wat er mis gaat; iets met erven of specificity dan
pi_70390424
quote:
Op vrijdag 26 juni 2009 11:26 schreef Roy_T het volgende:

[..]

Probeer "background: transparent" eens? En anders even in Firebug kijken wat er mis gaat; iets met erven of specificity dan
Background color werkt ook niet. Het gaat hier om een gevalletje volgorde. Is nu opgelost.
  vrijdag 26 juni 2009 @ 13:18:57 #169
134533 donroyco
dus niet Donroyco
pi_70393761
tvp.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
pi_70551417
Weet iemand of ik dmv een div een foutmelding aan een embed kan geven als de bezoeker geen Java heeft geinstalleerd?
pi_70553813
dmv een div een foutmelding aan een embed geven...

Verklaar u nader!
—o—
pi_70553951
quote:
Op woensdag 1 juli 2009 16:33 schreef Nashje het volgende:
Weet iemand of ik dmv een div een foutmelding aan een embed kan geven als de bezoeker geen Java heeft geinstalleerd?
onmogelijk ik denk dat je dan toch even je hoofd moet krabben en afvragen of je CSS wel snapt .

Het is een opmaaktaal. geen waarchuwings taal of programmeertaal waarin je voorwaardes kan stellen die niet met de opmaak te maken hebben.

Css bemoeit zich niet met java of javascript
Redacted
pi_70604537
quote:
Op woensdag 1 juli 2009 17:51 schreef cablegunmaster het volgende:

[..]

onmogelijk ik denk dat je dan toch even je hoofd moet krabben en afvragen of je CSS wel snapt .

Het is een opmaaktaal. geen waarchuwings taal of programmeertaal waarin je voorwaardes kan stellen die niet met de opmaak te maken hebben.

Css bemoeit zich niet met java of javascript
. Dat zeg ik toch ook niet.

Op een van mijn andere sites gebruik ik een div om te laten zien als de bezoeker geen Flash gebruikt.
  vrijdag 3 juli 2009 @ 10:50:55 #174
33189 RM-rf
1/998001
pi_70605051
quote:
Op vrijdag 3 juli 2009 10:34 schreef Nashje het volgende:

[..]

. Dat zeg ik toch ook niet.

Op een van mijn andere sites gebruik ik een div om te laten zien als de bezoeker geen Flash gebruikt.
dat heeft echter niks met CSS te maken...
maar is gewoon een eigenschap van HTML-rendering door je browser...


zo rendert bv een browser content die in een <NOSCRIPT> tag staat wél als iemand bv geen javascript heeft aanstaan...
tevens is het zo dat alle infor binnen een OBJECT (embed is geen HTML standaard tag) gebruikt wordt als een useragent de object-content zelf niet renderen kan en is specifiek bedoeld om informatie te geven aan UA#s die ddit dan als alternatieve content tonen (als het ware zoals een ALT-tag eigenlijk bedoeld is )
http://www.w3.org/TR/REC-html40/struct/objects.html#h-13.3.1
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_70605091
quote:
Op vrijdag 3 juli 2009 10:50 schreef RM-rf het volgende:

[..]

dat heeft echter niks met CSS te maken...
Dat zeg ik ook niet. Ik heb het over een div.

Er was/is geen topic over HTML.
  vrijdag 3 juli 2009 @ 11:27:15 #176
33189 RM-rf
1/998001
pi_70606345
quote:
Op vrijdag 3 juli 2009 10:52 schreef Nashje het volgende:

[..]

Dat zeg ik ook niet. Ik heb het over een div.

Er was/is geen topic over HTML.
Zou het dan geen idee zijn om gewoon zelf een topic op te starten met zulk een vraag ... in plaats die vraag te platsen in een ander 'groot-vragen-topic' waar die eigenlijk geheel niet hoort (sowieso is dat al snel een nadeel van zulke grote vragen-topics, dat mensen niet zelf meer een topic durven op te starten met een legitiem vragje)

Overigemns, ik heb je vraag beantwoord maar snap niet waarom jij over een div begint als je het eigenlijk over een embed/object hebt... een div is een hele andere tag die er verder niks mee te maken heeft en dus er ook niks meer te zoeken heeft...

wil je bepaalde content enkel tonen als een zekere extren aangeroepe embedded content niet gerenderd kan worden, kun je die als inhoud binnn een OBJECT plaatsen, of als je zo nodig de proprietaire EMBED wilt gebruiken, bestat daarvoor een NOEMBED tag:
http://www.utoronto.ca/webdocs/HTMLdocs/NewHTML/embed.html (waarschuwing, verouderd e site, ik zou hun tip om geen object te gebruiken niet al te serieus nemen, dat is jaren en jaren terug geschreven)
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_70830203
Is er een manier waarop ik dit effect: http://www.htmlcodetutorial.com/tables/index_famsupp_179.html met CSS kan bereiken?
Trotse poster van het 37000000ste bericht ^O^
pi_70833745
quote:
Op donderdag 9 juli 2009 22:21 schreef daReaper het volgende:
Is er een manier waarop ik dit effect: http://www.htmlcodetutorial.com/tables/index_famsupp_179.html met CSS kan bereiken?
Je kunt cellen gewoon borders geven, dus: ja.
pi_70847030
quote:
Op donderdag 9 juli 2009 22:21 schreef daReaper het volgende:
Is er een manier waarop ik dit effect: http://www.htmlcodetutorial.com/tables/index_famsupp_179.html met CSS kan bereiken?
Elke cell een apparte class geven en dan border-top uitzetten etc...
pi_70873533
quote:
Op vrijdag 10 juli 2009 13:40 schreef Flaccid het volgende:

[..]

Elke cell een apparte class geven en dan border-top uitzetten etc...
Probleem is dat ik alleen controle heb over de CSS, niet over de HTML-output... Hoeveel manieren blijven er dan nog over?
Trotse poster van het 37000000ste bericht ^O^
pi_70873938
quote:
Op zaterdag 11 juli 2009 12:47 schreef daReaper het volgende:

[..]

Probleem is dat ik alleen controle heb over de CSS, niet over de HTML-output... Hoeveel manieren blijven er dan nog over?
Dus hoe de tabel in elkaar zit heb jij totaal geen controle over? Slechts een css ding? mmm, lastig. Probeer dit eens:

1
2
3		table{
border: none;
}
pi_70873979
quote:
Op zaterdag 11 juli 2009 12:47 schreef daReaper het volgende:

[..]

Probleem is dat ik alleen controle heb over de CSS, niet over de HTML-output... Hoeveel manieren blijven er dan nog over?
Dan zou je alle cellen een border (boven + links) kunnen geven. Vervolgens de cellen in de eerste rij geen border boven, en de eerste cel per rij geen border links.

1
2
3
4
5
6
7
8
9
10
11		table tbody tr td {
    border: 0;
    border-top: 1px solid red;
    border-left: 1px solid red;
}
table tbody tr:first-child td {
    border-top: 0;
}
table tbody tr td:first-child {
    border-left: 0;
}


Niet getest. Sowieso gaat het niet werken in IE6, die ondersteunt :first-child niet.
fokstok.nl
pi_70875144
quote:
Op zaterdag 11 juli 2009 13:04 schreef Light het volgende:

[..]

Dan zou je alle cellen een border (boven + links) kunnen geven. Vervolgens de cellen in de eerste rij geen border boven, en de eerste cel per rij geen border links.
[ code verwijderd ]

Niet getest. Sowieso gaat het niet werken in IE6, die ondersteunt :first-child niet.
tof! Werkt in elk geval prima in IE7 en Moz, bedankt
Trotse poster van het 37000000ste bericht ^O^
  maandag 13 juli 2009 @ 14:25:09 #184
179307 Saboo
Hoi ik zit op fok
pi_70933501
hoi, ik ben een totale noob met CSS, maar ik dacht 'leuk laat ik eens een website maken' ... Gaat vrij makkelijk tot nog toe, alleen heb ik 1 probleempje wat wsl een heel stom iets is.

de HTML

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15		<body>
<div id="main_container">
<div id="box1">box1</div>

<div id="Menu">
<div id="box2">box2</div>
<div id="box3">box3</div>
<div id="box4">box4</div>
</div>

<div id="box5">box5 dit is een test</div>
</div>


</body>


De CSS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73		a {
   font-size: 16px;
   color: #CCF;
}
a:link {
   text-decoration: none;
}
a:visited {
   text-decoration: none;
   color: #CCC;
}
a:hover {
   text-decoration: none;
}
a:active {
   text-decoration: none;
}
body{
margin: 0;
text-align: center;
}

div#main_container{
margin: 0 auto 0 auto;
width: 750px;
text-align: left;
}

div#box1{
float:left;
width: 213px;
height: 600px;
background:url(sitebasis%20copy.jpg);
}

div#box2{
position:relative;
float:none;
width: 156px;
height: 118px;
background-color:#6F0;
}

div#box3{
position:relative;
float:none;
width: 156px;
height: 142px;
background-color:#933;
}

div#box4{
position:relative;
float:none;
width: 156px;
height: 340px;
background-color:#00F;
}

div#box5{
position:relative;
left: 369px;
width: 384px;
height: 600px;
background-color:#C9C;
}

div#Menu{
position:relative;
float:left;
width: 384px;
height: 600px;
}


Het kan vast beter enzo, maar ik vond het zo vrij makkelijk gaan... Het probleem is echter dat de text van box 5, niet in de box zelf zit maar er onder. Wsl iets heel stoms :o
Wie o wie kan mij helpen?

bij voorbaat heel veel dank!
pi_70933828
Je wilt box 5 naast het menu hebben? Dan moet je box5 ook een float: left; geven Als ie er dan nog onder gaat dan is de container te klein.

float: none; en position: relative; kunnen weg trouwens.

1
2
3
4
5
6
7
8
9
10
11		<div id="main_container">
<div id="box1">box1</div>

<div id="Menu">
<div id="box2">box2</div>
<div id="box3">box3</div>
<div id="box4">box4</div>
</div>

<div id="box5">box5 dit is een test</div>
</div>


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70		a {
   font-size: 16px;
   color: #CCF;
}

a:link {
   text-decoration: none;
}

a:visited {
   text-decoration: none;
   color: #CCC;
}

a:hover {
   text-decoration: none;
}

a:active {
   text-decoration: none;
}

body {
   margin: 0;
   text-align: center;
}

div#main_container {
   margin: 0 auto 0 auto;
   width: 750px;
   text-align: left;
}

div#box1 {
   float:left;
   width: 200px;
   height: 600px;
   background:url(sitebasis%20copy.jpg);
}

div#box2 {
   width: 150px;
   height: 118px;
   background-color:#66FF00;
}

div#box3 {
   width: 150px;
   height: 142px;
   background-color:#993333;
}

div#box4 {
   width: 150px;
   height: 340px;
   background-color:#0000FF;
}

div#box5 {
   float: left;
   width: 400px;
   height: 600px;
   background-color:#CC99CC;
}

div#Menu {
   float:left;
   width: 150px;
   height: 600px;
}


Levert dit op:



[ Bericht 20% gewijzigd door Chanty87 op 13-07-2009 14:44:24 ]
シ
  maandag 13 juli 2009 @ 14:55:02 #186
179307 Saboo
Hoi ik zit op fok
pi_70934337
zo is hij beter idd

Hartstikke bedankt!
pi_70966409
Ik ben sinds kort ( paar dagen ) ook bezig met DIVjes, maar ik zit nu met een probleem.
Ik wil graag dat mijn DIVjes meeschijven als er tekst in staat, maar wat er nu gebeurt is dat alle tekst als het ware gewoon doorloopt.
Nu heb ik dit kunnen oplossen door gebruik te maken van overflow: hidden;
Maar dit is in mijn ogen niet de oplossing, het moet toch mogelijk zijn dat alles gewoon met de tekst meeschuift?

de code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117		@charset "utf-8";

body {
 font-family: Arial, serif;  font-size: 10pt;
 
}
A:visited {text-decoration: none; color: white}
A:link {text-decoration: none; color: white}
A:active {text-decoration: none; color: white}
A:hover {text-decoration: underline; color: lightgreen;}


.big-main {
    position: absolute;
    background-image: url(bg.jpg);
    background-repeat:repeat-x;
    height: 100%;
    width: 100%;
}

.topmain {

position:relative;
height:178px;
width:802px;
background-image: url('images/header.png');
border:thin #CCCCCC solid;
}

.menu {

position:relative;
border:thin #CCCCCC solid;
background-color:#1A1A1A;
font: Verdana;
height:37px;
width:802px;
background-image: url('images/menu/menubg.png');
background-repeat:repeat-x;
color: white;
text-align: right;

}

.menuheader {

  border:thin #CCCCCC solid;
  color: white;
  height: 28px;
  background-color:#1A1A1A;
  background-image: url('images/menu/menuheader.png');
  background-repeat:repeat-x;
  
}
.menuitem {
 
  color: white;
  text-align: left;
  height: 26px;
  background-color:#1A1A1A;
  background-image: url('images/menu/menuitem.png');
  background-repeat:repeat-x;
  
}

.contentitemheader {
 
  color: white;
  text-align: center;
  height: 26px;
  background-color:#1A1A1A;
  background-image: url('images/menu/menuitem.png');
  background-repeat:repeat-x;
  
}
.contentitem {
 
  color: white;
  text-align: left;
  height: 26px;
  background-color:#1A1A1A;

}


#container { 
    width:802px;
    height: 80%;
    margin: 0; 
} 
#div1 { 
    background: #000000; 
    width: 32%; 

    float: left; 
    border:thin #CCCCCC solid;
background-color:#1A1A1A;
} 

#div2 { 
    background: #555555; 
    width: 65%; 
    height: 80%;
    float: right; 
    border:thin #CCCCCC solid;
    background-color:#1A1A1A;
    overflow:hidden; 

} 

#div3 { 
    background: #000000; 
    width: 32%; 
    float: left; 
    border:thin #CCCCCC solid;
    background-color:#1A1A1A;
} 


Als iemand op andere punten nog fouten ziet, of dingen die beter kunnen dan sta ik daar ook altijd open voor.
pi_70971169
quote:
Op dinsdag 14 juli 2009 14:20 schreef DirkZz het volgende:

Maar dit is in mijn ogen niet de oplossing, het moet toch mogelijk zijn dat alles gewoon met de tekst meeschuift?
Geen height definiëren
pi_70972314
quote:
Op dinsdag 14 juli 2009 16:23 schreef Roy_T het volgende:

[..]

Geen height definiëren
Had ik ook geprobeert, dan gaat div#3 flippen, en er onder staan.

1. Zonder height ingesteld:
http://i26.tinypic.com/4pv8z5.png

2. met height ingesteld:
http://i28.tinypic.com/19l9xj.png
pi_70973297
quote:
Op dinsdag 14 juli 2009 @ 16:54 schreef DirkZz het volgende:

[..]

Had ik ook geprobeert, dan gaat div#3 flippen, en er onder staan.

1. Zonder height ingesteld:
http://i26.tinypic.com/4pv8z5.png

2. met height ingesteld:
http://i28.tinypic.com/19l9xj.png
Alles wat onder elkaar moet doe je samen nesten in een div.

Is semantischer ook.
—o—
pi_70973643
^ Yup, dus die 2 blokken links in één div stoppen en die een float: left; geven.
シ
pi_70973667
1
2
3
4
5
6
7
8
9
10		<div id="container"> 
    <div id="div1">
    <div class=menuheader><b>Karting menu</b></div>
      <div class=menuitem>Menu items uit database</div>


<div id="div3">
          <div class=menuheader><b>Autocross menu</b></div>
            <div class=menuitem>Menu items uit database</div>
          </div></div>


Heb het nu zo, maar nu verschijnt het 2e menu, in het eerste menu.
pi_70973699
Heb je de floats van div1 en div3 weggehaald?
シ
pi_70973733
quote:
Op dinsdag 14 juli 2009 @ 17:37 schreef DirkZz het volgende:

[ code verwijderd ]

Heb het nu zo, maar nu verschijnt het 2e menu, in het eerste menu.
Kijk eens naar de post hierboven van Chanty87 (met paint), en pak het op zo'n manier aan.


1
2
3
4
5
6
7
8		<div #wrapper>
  <div #linkerkolom>
    <div #boven></div>
    <div #onder></div>
  </div>
  <div #rechterkolom>
  </div>
</div>



schematis is dit de structuur die je nodig hebt.
—o—
pi_70973786
Als ik dat doe heft het geen nut, dan staat echt alles door mekaar.

edit:

@hierboven

Ik zal er naar kijken.
pi_70973843
Deze post bedoelt DD neem ik aan
シ
pi_70973996
weg

[ Bericht 84% gewijzigd door DirkZz op 14-07-2009 18:22:16 ]
pi_70975041
Dit is wat ik nu heb:
http://i32.tinypic.com/x9lps.png
http://i30.tinypic.com/2upwvmg.png

Maar het buigt allemaal nog steeds niet mee.
pi_70976275
Ja je hebt nog steeds een vaste hoogte op de rechterkolom staan zo te zien.

Komop zeg een beetje trial-and-error kan geen kwaad! Je kunt niets verneuken wat ctrl-z niet op kan lossen!
—o—
pi_70977816
dan verschuift de hele boel weer.
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[CSS] voor dummies - deel 12
Index

» digital corner

» development

Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')