Bonjour,
Je suis sur la mise en page d'un formulaire et je n'arrive pas à avoir le rendu voulu sur safari je vous met mon code et un screen shot des rendu sur firefox et sur safari:
ça rend bien sur firefox:
par contre sur safari les select me posent problème(ça rend la même chose sur ie):
voici le html:
voici le css:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 <form method='post' action='add_infos.php' enctype="multipart/form-data" > <ol> <li> <span>jajoute</span> </li> <li> <label for="name"> <span>Pseudo: </span> <input class="name" type="text" name="name" id="name" size="10" maxlength="15" /> </label> </li> <li> <label for="cp"> <span>Code postal: </span> <input class="postal" type="text" name="cp" id="cp" size="5" maxlength="5" /> </label> </li> <li> <label for="adult"> <span>Nb d'adultes: </span> <select class="nb" name="adult" id="adult"> <?php for($i=0; $i < 5; $i++){ echo "<option value='".$i."'>".$i."</option>" ; }?> <option value=">5">>5</option> </select> </label> </li> <li> <label for="child"> <span>Nb d'enfants: </span> <select class="nb" name="child" id="child"> <?php for($i=0; $i < 5; $i++){ echo "<option value='".$i."'>".$i."</option>" ; }?> <option value=">5">><span>5</span></option> </select> </label> </li> <li> <label for="room"> <span>Pièce: </span> <select class="room" name="room" id="room"> <option value="la Chambre">la Chambre</option> <option value="la Salle de Bain">la Salle de Bain</option> <option value="les Toilettes">les Toilettes</option> <option value="la Cuisine">la Cuisine</option> <option value="le Salon">le Salon</option> </select> </label> </li> <li> <label for="photo"> <input type="hidden" name="MAX_FILE_SIZE" value="2097152"> <input class="photo" type="file" name="photo"> </label> </li> <li> <input type="submit" value="Afficher" class="submit"/> </li> </ol> </form>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 form { margin: -20px auto; background-color: #36A6FF; color: #36A6FF; border: 1px solid #fff; -webkit-border-radius:4px; -moz-border-radius: 4px; border-radius:4px; font-size: 14px; width:300px; height: 300px; } ol { margin-left: -29px; } input, select { margin: 0 5px; color: #36A6FF; font-weight: bold; height: 35px; } input.name { padding-left:61px; width: 275px; } input.postal { padding-left:86px; width: 275px; } select.nb { padding-left:90px; padding-top: 3px; width: 130px; } select.room { width: 275px; } input.photo { } input.submit { margin: 0 auto; } li { position: relative; display: inline-block; margin: 0 0 10px; } label span { position: absolute; left: 10px; top: 10px; }
Partager