2 Design vragen
Vraag 1:
Ik heb een midden deel 850px breed. En aan de linker kant moet een ander achtergrond plaatje komen dan aan de rechterkant. Ze moeten ook allebei automatisch even breed worden. Allebei moeten ze op repeat x staan. Maar het lukt me niet, weet iemand hoe ik dat voor elkaar kan krijgen?
Vraag 2:
Op de volgende site: http://3drockz.com/ heb je een menu boven in wat blijft staan als de site gaat scrollen. Ik heb wel floating menu's gevonden, maar die haperen bij het scroller. Ik zou graag zo menu willen hebben wat bovenin blijft. Maar ik weet niet hoe het moet. Iemand een idee?
Gewijzigd op 01/01/1970 01:00:00 door Thomas
Broncode bekijken ...
Code (php)
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
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
/*
** Tab navigation
*/
ul.primary {
border-collapse: collapse;
padding: 0 0 0 1em;
white-space: nowrap;
list-style: none;
margin: 5px;
height: auto;
line-height: normal;
border-bottom: 1px solid #bbb;
}
ul.primary li {
display: inline;
}
ul.primary li a {
background-color: #ddd;
border-color: #bbb;
border-width: 1px;
border-style: solid solid none solid;
height: auto;
margin-right: 0.5em;
padding: 0 1em;
text-decoration: none;
}
ul.primary li.active a {
background-color: #fff;
border: 1px solid #bbb;
border-bottom: #fff 1px solid;
}
ul.primary li a:hover {
background-color: #eee;
border-color: #ccc;
border-bottom-color: #eee;
}
ul.secondary {
border-bottom: 1px solid #bbb;
padding: 0.5em 1em;
margin: 5px;
}
ul.secondary li {
display: inline;
padding: 0 1em;
border-right: 1px solid #ccc;
}
ul.secondary a {
padding: 0;
text-decoration: none;
}
ul.secondary a.active {
border-bottom: 4px solid #999;
}
** Tab navigation
*/
ul.primary {
border-collapse: collapse;
padding: 0 0 0 1em;
white-space: nowrap;
list-style: none;
margin: 5px;
height: auto;
line-height: normal;
border-bottom: 1px solid #bbb;
}
ul.primary li {
display: inline;
}
ul.primary li a {
background-color: #ddd;
border-color: #bbb;
border-width: 1px;
border-style: solid solid none solid;
height: auto;
margin-right: 0.5em;
padding: 0 1em;
text-decoration: none;
}
ul.primary li.active a {
background-color: #fff;
border: 1px solid #bbb;
border-bottom: #fff 1px solid;
}
ul.primary li a:hover {
background-color: #eee;
border-color: #ccc;
border-bottom-color: #eee;
}
ul.secondary {
border-bottom: 1px solid #bbb;
padding: 0.5em 1em;
margin: 5px;
}
ul.secondary li {
display: inline;
padding: 0 1em;
border-right: 1px solid #ccc;
}
ul.secondary a {
padding: 0;
text-decoration: none;
}
ul.secondary a.active {
border-bottom: 4px solid #999;
}
Ik gok op dit
Gewijzigd op 01/01/1970 01:00:00 door Wouter K
Het middendeel van 850px kan je centreren door margin:0px auto; te gebruiken in je css voor die div.
Vraag2:
Zie:cssplay
Of mooier, met scrollbalk voor de content:
Cssplay2
En zelfde verhaal met meerdere kolommen:
Cssplay3
Gewijzigd op 01/01/1970 01:00:00 door Robert Deiman
Maar wie kan me helpen met hoe ik me div;s moet instellen zodat mijn layout werkt?
In dit geval kan je mss met procenten werken ?
grote container verdelen in 3 stukken (in jouw voorbeeld).
Links -> 50 %
Midden -> 850 px;
rechts -> 50 %
Ik gok op dat ?
Misschien twee divs op achtergrond van 50% absoluut positioneren en in het midden een div van 850px breed eroverheen..
Succes met proberen ;)