Thread: links zijn dood?
-
23-06-2010, 15:15 #31Approved 9-lifer
- Registered
- 04/08/09
- Location
- Merelbeke, Gent, Belgium
- Posts
- 263
- iTrader
- 0
- Mentioned
- 0 Post(s)
- Reputation
- 0/1
In HTML zijn er de zgn. "box" elementen. Dit zijn oa. div, p, li, ...
En op die box elementen kan je bepaalde afmetingen geven (in absolute waarden (px) of relatieve waarden (em), verder kan je ook nog percentages opgeven, maar die zijn doorgaans bijzonder ingewikkeld)
Hou dit gewoon in gedachten:
- margin is de plaats tussen de "parent" box en de huidige box
- border is de rand rond de padding van de huidige box
- padding is de rand rond de inhoud van de huidige box (hetgeen je tussen de tags zelf hebt geschreven)
Hier even in afbeeldingvorm:
http://escience.anu.edu.au/lecture/c...age/boxdim.png
Dit is misschien nog nét iets te theoretisch, maar als je wat googlet op de individuele trefwoorden van hierboven kom je er wel denk ik..no votes
-
-
23-06-2010, 19:28 #32
tgeen je hier zegt snap ik al een beetje met de margin en padding en zo ik denk dat ik wel op de juiste weg ben maar ik krijg op geen manier 2 kaders naast elkaar ik heb al geprobeert met "display: inline;" maaar het lukt me niet
CaMoFlAgE/Helze/Jokke0066no votes
-
23-06-2010, 19:45 #33Approved 9-lifer
- Registered
- 04/08/09
- Location
- Merelbeke, Gent, Belgium
- Posts
- 263
- iTrader
- 0
- Mentioned
- 0 Post(s)
- Reputation
- 0/1
2 kaders gaat perfect:
Voer dit uit in je browser:
En haal dan eens de commentaar weg in de CSS (/* en */ wegdoen)Code:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <TITLE>Html document</TITLE> <STYLE> div { width: 150px; } .div1 { /*display:inline;*/ } .div2 { /*display:inline;*/ } </STYLE> </HEAD> <BODY> <div class="div1"> div1 </div> <div class="div2"> div2 </div> </BODY> </HTML>
En doe dan eens refresh.
QED (toch in firefox)
De default value van een box element is inderdaad display:block, en dan genereert elk box element een breakline na de tag. display:inline gaat dat tegen..no votes
-
23-06-2010, 20:00 #34
het werkt EINDELIJK

zkit dan alleen met het volgende probleem xD nu word de border aangepast naar de grote van het woord maar die zou zo grote die ik heb ingesteld.CaMoFlAgE/Helze/Jokke0066no votes
-
23-06-2010, 20:17 #35Approved 9-lifer
- Registered
- 04/08/09
- Location
- Merelbeke, Gent, Belgium
- Posts
- 263
- iTrader
- 0
- Mentioned
- 0 Post(s)
- Reputation
- 0/1
no votes
-
23-06-2010, 20:24 #36Member
- Registered
- 19/02/06
- Location
- -
- Posts
- 4,048
- iTrader
- 1 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 2/73
Het beste hier lijkt mij gewoon alles wat je denkt te weten over CSS en HTML vergeten en van 0 beginnen met tutorials van bijvoorbeeld w3schools.
no votes
-
23-06-2010, 21:27 #37no votes
-
23-06-2010, 21:31 #38dit zijn de 2 kolomen die ik naast elkaar wil de 1ne met 750px:width en de 2e met 150px:widthCode:
div.linkerkolom{ width: 750px; border:2px solid; display: inline; } div.rechterkolom{ width: 150px; border:2px solid; display: inline; }
begrijp je het?CaMoFlAgE/Helze/Jokke0066no votes
-
23-06-2010, 21:40 #39
kep het al gevonden kmoest gewoon "inline-table" gebruiken in plaats van "inline"
CaMoFlAgE/Helze/Jokke0066no votes
-
23-06-2010, 23:03 #40
kzit weeral met een volgend vraagje maar dan is men homepage bijna af.
hoe kan ik tekst naast een foto zetten?
nu komt de tekst:
___________
|-----------|
|-----------|
|----foto---|MAAR ik wil de tekst hier
|-----------|
|__________|hier staat men tekst dan
is het zo duidelijk uitgelegd
CaMoFlAgE/Helze/Jokke0066no votes
-
23-06-2010, 23:04 #41Member
- Registered
- 19/02/06
- Location
- -
- Posts
- 4,048
- iTrader
- 1 (100%)
- Mentioned
- 0 Post(s)
- Reputation
- 2/73
img {
float:left;
}no votes
-
24-06-2010, 13:09 #42
dat probleem heb ik nu ook opgelost men home page is nu af.
Nu de andere 7 pagina's nog
CaMoFlAgE/Helze/Jokke0066no votes
-
24-06-2010, 13:58 #43
voor ik met de 7 pagina's kan beginnen zit ik weer met een nieuwe fout:
ik heb men site steeds gecontroleerd in "firefox" dus daar werk de homepage perfect maar nu zie ik dat die niet werkt in "internet Explorer"
het enige probleem is dat de kaders niet meer "inline" staanCaMoFlAgE/Helze/Jokke0066no votes
-
24-06-2010, 15:27 #44
gebruik is float: left als je 2 divs naast elkaar wil hebben.
Code:div#main { position: absolute; width: 800px; margin-left: -450px; left: 50%; } div.div1 { width: 650px; height: 300px; float: left; background-color: green; } div.div2 { width: 150px; height: 300px; float: left; background-color: red; clear: right; } div.div3 { width: 400px; height: 50px; float: left; background-color: blue; } div.div4 { width: 400px; height: 50px; float: left; background-color: yellow; }HTML Code:<div id="main"> <div class="div1">Eerste div</div> <div class="div2">Tweede div</div> <div class="div3">Derde div</div> <div class="div4">Vierde div</div> </div>
Last edited by Curahee Q; 25-06-2010 at 19:49.
no votes
-
24-06-2010, 20:58 #45HTML Code:
<div class="clear"></div>
no votes

