Fout in code

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Top Low-Code Developer Gezocht!

Bedrijfsomschrijving Unieke Kansen, Uitstekende Arbeidsvoorwaarden & Inspirerend Team Wij zijn een toonaangevende, internationale organisatie die de toekomst van technologie vormgeeft door het creëren van innovatieve en baanbrekende oplossingen. Ons succes is gebaseerd op een hecht en gepassioneerd team van professionals die altijd streven naar het overtreffen van verwachtingen. Als jij deel wilt uitmaken van een dynamische, vooruitstrevende en inspirerende werkomgeving, dan is dit de perfecte kans voor jou! Functieomschrijving Als Low-Code Developer ben je een cruciaal onderdeel van ons team. Je werkt samen met collega's uit verschillende disciplines om geavanceerde applicaties te ontwikkelen en te optimaliseren met behulp van Low-code

Bekijk vacature »

Dimitri Geers

Dimitri Geers

05/10/2014 15:23:48
Quote Anchor link
Hallo allemaal,

Ik ben bezig met het maken van een dashboard.
Maar ik heb ergens een fout in mijn code zitten waardoor sommige elementen niet goed worden weergeven.
Tevens werk ik voor het eerst met procenten in plaats van pixels.
Kan iemand mij helpen?

Alvast bedankt!

Met vriendelijke groet,
Dimitri Geers

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<html>

    <head>
        <title>Dashboard | Dimitri Geers CMS</title>
        
        <link href="dashboard.css" rel="stylesheet">
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="css/font-awesome.min.css">
        
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta name="description" content="Dimitri Geers CMS" />
        <meta name="author" content="Dimitri Geers" />
    </head>
    
    <body>
    
        <div class="sidebar">
        
            <div class="logo">
                
                <img src="logo-wit.png" />
                
            </div>
            
            <div class="titel">Menu</div>
            
                <ul>
                
                    <li>Home</li>
                    <div class="divider"></div>
                    <li>Pagina</li>
                    <div class="divider"></div>
                    <li>Menu</li>
                    <div class="divider"></div>
                    <li>Nieuws</li>
                    <div class="divider"></div>
                    <li>Agenda</li>
                    <div class="divider"></div>
                    <li>Portfolio</li>
                    <div class="divider"></div>
                
                </ul>
                
            <div class="titel">Admin Menu</div>
            
                <ul>
                
                    <li><i class="icon-user"></i> Gebruikers</li>
                    <div class="divider"></div>
                    <li><i class="icon-sort-by-attributes"></i> Rangen</li>
                    <div class="divider"></div>
                    <li><i class="icon-pencil"></i> Website</li>
                    <div class="divider"></div>
                    <li><i class="icon-screenshot"></i> Logs</li>
                    <div class="divider"></div>
                
                </ul>
        
        </div>
        
        <div class="container">
        
            <div class="header">
                
                    <div class="profiel"><div style="
                    
                        width: 80px;
                        height: 80px;
                        border-radius: 40px;
                        -webkit-border-radius: 40px;
                        -moz-border-radius: 40px;
                        background: url(http://www.dimitrigeers.nl/cms/profiel.png) no-repeat;
                        box-shadow: 0 0 8px rgba(0, 0, 0, .8);
                        -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
                        -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
                        float: left;
                    
                    "></div> <div class="tekst">Dimitri Geers</div></div>
                    
                    <div class="menu"><i class="icon-cog"></i> Instellingen&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<i class="icon-signout"></i> Afmelden</div>
                    
            </div>
                
            <div class="stats">
                
                <div class="stats-oranje">
                    
                    <div style="font-size: 23px;margin-bottom: 1%;"><b>4</b></div>
                    <div style="font-size: 18px;">Geregistreerde sites</div>
                    <div style="font-size: 15px;">in jouw beheer</div>
                    
                </div>
                    
                <div class="stats-groen">
                
                    <div style="font-size: 23px;margin-bottom: 1%;"><b>1810</b></div>
                    <div style="font-size: 18px;">Gebeurtenissen</div>
                    <div style="font-size: 15px;">in de logs</div>
                    
                </div>
                    
                <div class="stats-lichtblauw">
                    
                    <div style="font-size: 23px;margin-bottom: 1%;"><b>5</b></div>
                    <div style="font-size: 18px;">Gebruikers</div>
                    <div style="font-size: 15px;">beheren dezelfde sites</div>
                    
                </div>
                    
                <div class="stats-donkerblauw">
                    
                    <div style="font-size: 23px;margin-bottom: 1%;"><b>18324</b></div>
                    <div style="font-size: 18px;">Aantal keer bekeken</div>
                    <div style="font-size: 15px;">alle sites die jij beheert</div>
                    
                </div>
                
            </div>
                
            <div class="versie-message">
                
                Uw CMS draait op de volgende versie: V3.0.0. Update's worden automatisch uitgevoerd!
                
            </div>
            
        </div>
    
    </body>

</html>


Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
body {

    font-family: "Helvetica Neue", Helvetica, "Noto Sans", sans-serif, Arial, sans-serif;
    padding: 0px;
    margin: 0px;

}

/* Begin sidebar */

.sidebar {

    height: 100%;
    width: 20%;
    background-color: #2F3543;
    color: #949494;
    float: left;
    position: fixed;

}

.sidebar .logo {

    width: 90%;
    height: auto;
    margin: 0px auto;

}

.sidebar .logo img {

    width: 100%;
    height: auto;
    margin-top: 6%;

}

.sidebar .titel {

    background-color: #282B34;
    width: 90%;
    height: auto;
    padding: 4%;
    padding-left: 5%;
    padding-right: 5%;
    font-size: #17px;
    color: #FFF;
    border-top: 1% solid;
    border-bottom: 1% solid;
    border-color: #212832;
    margin-top: 6%;

}

/* sidebar menu */

.sidebar ul {

    list-style-type: none;
    padding: 0px;
    margin: 0px;

}

.sidebar ul li {

    width: 100%;
    height: auto;
    font-size: 15px;
    padding: 4%;
    padding-left: 5%;
    padding-right: 5%;

}

.sidebar ul li:hover {

    width: 90%;
    background-color: #404759;

}

.sidebar ul .divider {

    height: 0.25%;
    width: 100%;
    background-color: #404759;

}

/* Begin main content */

.container {

    width: 70%;
    height: auto;
    margin-left: 25%;
    margin-top: 1%;
    position: absolute;

}

/* Header */

.header {

    width: 100%;
    height: auto;
    color: #6C6C6E;
    margin-bottom: 4%;

}

.header .profiel {

    width: 50%;
    height: auto;
    float: left;
    clear: both;

}

.header .profiel .tekst {

    width: 40%;
    height: auto;
    float: left;
    margin-left: 5%;
    margin-top: 7%;
}

.header .menu {

    width: 50%;
    height: auto;
    margin-top: 3.5%;
    text-align: right;
    float: left;
    
}

/* Statistieken */

.stats {

    width: 100%;
    height: auto;
    margin-top: 4%;

}

.stats .stats-oranje {

    background: #F26C4F;
    width: 21.5%;
    margin-right: 2%;
    padding: 1%;
    padding-top: 2%;
    padding-bottom: 2%;
    color: #FFF;
    float: left;

}

.stats .stats-groen {

    background-color: #00A652;
    width: 21.5%;
    margin-right: 2%;
    padding: 1%;
    padding-top: 2%;
    padding-bottom: 2%;
    color: #FFF;
    float: left;

}

.stats .stats-lichtblauw {

    background-color: #00BFF3;
    width: 21.5%;
    margin-right: 2%;
    padding: 1%;
    padding-top: 2%;
    padding-bottom: 2%;
    color: #FFF;
    float: left;

}

.stats .stats-donkerblauw {

    background-color: #0072BD;
    width: 21.5%;
    padding: 1%;
    padding-top: 2%;
    padding-bottom: 2%;
    color: #FFF;
    float: left;

}

/* Versie bericht */

.versie-message {

    background-color: #2F3543;
    width: 98%;
    height: auto;
    margin-top: 2%;
    color: #949494;
    padding: 1%;

}
 
PHP hulp

PHP hulp

26/05/2026 12:59:28
 
Ozzie PHP

Ozzie PHP

05/10/2014 15:45:13
Quote Anchor link
>> Maar ik heb ergens een fout in mijn code zitten waardoor sommige elementen niet goed worden weergeven.

Goh... zou het toch niet handig zijn als je aangeeft WAT er niet goed wordt weergegeven, en als je alleen RELEVANTE code plaatst? Wat moeten we hier nu mee? "Er zit ergens een fout en iets wordt niet goed weergegeven." Leg dan aub op z'n minst uit WAT er niet goed wordt weergegeven.
 
Dimitri Geers

Dimitri Geers

05/10/2014 15:51:23
Quote Anchor link
Alles wat in de div container staat.

Toevoeging op 05/10/2014 15:51:53:

Je kunt hem bekijken op: www.dimitrigeers.nl/cms
 
Frank Nietbelangrijk

Frank Nietbelangrijk

05/10/2014 17:03:11
Quote Anchor link
Wat is dit voor gekkigheid met die div's ertussen ?
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
               <ul>
                
                    <li>Home</li>
                    <div class="divider"></div>
                    <li>Pagina</li>
                    <div class="divider"></div>
                    <li>Menu</li>
                    <div class="divider"></div>
                    <li>Nieuws</li>
                    <div class="divider"></div>
                    <li>Agenda</li>
                    <div class="divider"></div>
                    <li>Portfolio</li>
                    <div class="divider"></div>
                
                </ul>


Toevoeging op 05/10/2014 17:04:10:

Waarom inline CSS?

Toevoeging op 05/10/2014 17:06:16:

Wat is dit? <i class="icon-cog">
 
Dimitri Geers

Dimitri Geers

05/10/2014 17:18:52
Quote Anchor link
Dat zijn iconen. Als je nou eens op: www.dimitrigeers.nl/cms zou kijken, had je dit geweten.
Maakt verder niet uit, maar scheelt weer een post.
 
Frank Nietbelangrijk

Frank Nietbelangrijk

05/10/2014 17:44:04
Quote Anchor link
Natuurlijk Dimitri..

Ik plaats altijd onzin :-) Maar de w3c validator is het wel met me eens:
Je mag geen <div>'s in een <ul> plaatsen!

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.dimitrigeers.nl%2Fcms%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Iconen zijn gewoon plaatjes. Images dus. die zet je niet met behulp van een <i> element.
Gewijzigd op 05/10/2014 17:46:17 door Frank Nietbelangrijk
 
Dimitri Geers

Dimitri Geers

05/10/2014 17:51:50
Quote Anchor link
Ik snap totaal niet wat je bedoelt, maar maakt niet uit. :p

Nu weer even on-topic. Het ging om de inhoud van de div: container.
Die wordt niet goed weergeven.
 
Frank Nietbelangrijk

Frank Nietbelangrijk

05/10/2014 18:02:21
Quote Anchor link
Dimitri Geers op 05/10/2014 17:51:50:
Ik snap totaal niet wat je bedoelt, maar maakt niet uit. :p


dit mag:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
<ul>
    <li>eerste listitem</li>
    <li>tweede listitem</li>
    <li>derde listitem</li>
</ul>


dit mag niet:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
<ul>
    <li>eerste listitem</li>
    <div>hier mag geen div!</div>
    <li>derde listitem</li>
</ul>


Toevoeging op 05/10/2014 18:03:03:

Als het jou ook niet uitmaakt dan maakt t mij ook niet uit hoor. Toedeloei
 
Dimitri Geers

Dimitri Geers

05/10/2014 18:17:27
Quote Anchor link
Oh, je bedoelt die div? Die heb ik gebruikt omdat border-bottom niet werkt.
Ik had geen idee hoe ik anders de dividers erin kreeg.
 
Phpnuke r

phpnuke r

06/10/2014 01:41:17
Quote Anchor link
Dat is natuurlijk geen goeie oplossing hé. Border-bottom zou op een LI moeten werken (desnoods met een andere CSS Display). Ik zie dat je de list items wel een border-bottom hebt gegeven, en dat deze niet werkt. Dat komt omdat je in procenten werkt. Procenten werken niet overal!!! Je moet er met een gezond verstand over gaan na denken. Op welke basis moet een border op procenten worden berekend?

Haal code die NIET word gebruikt overigens weg. Je kiest ervoor om er een div tussen te zetten(overigens erg foute html code) maar houdt de oude code nog op zijn plaats. Dit is in het begin niet erg maar na enkele (grondige )aanpassingen ga je door de bomen het bos niet meer zien.

En over de container: daar gaat inderdaad een hoop mis. Maar hoe het moet zijn is ook niet duidelijk. Moet de menu in de balk staan?

Persoonlijk vind ik het inrichten van zulke pagina erg basic css&html. Niet dat dit erg is maar misschien is het beter dat je gewoonweg html&css tutorials gaat doorlezen of desnoods een boek. Je komt nu namelijk vast te zitten op een punt dat een boek/tutorial (vaak )netjes voor je uitlegt, stap voor stap.
 
Jacco Engel

Jacco Engel

06/10/2014 12:13:27
Quote Anchor link
Als het doel is dat alle 4 blokken naast elkaar komen kun je stats-oranje een clear:left geven.

Niet dat het design er van opknapt maar heb je ze wel naast elkaar staan :)

Toevoeging op 06/10/2014 12:13:29:

Als het doel is dat alle 4 blokken naast elkaar komen kun je stats-oranje een clear:left geven.

Niet dat het design er van opknapt maar heb je ze wel naast elkaar staan :)
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.