centrer unCalendar en css

**alheuredudejeuner** · 18/10/2013, 07h59

Bonjour

Je souhaite centrer un calandar au milieu d'un div depuis un css.

C'est pour une page destinée aux mobiles.

align : center, fonctionne au poil, mais c'est déprécié.

j'ai essayé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
.Centrer 
{
    margin: auto auto;
    text-align: center;

Mais ça ne fonctionne pas.

une idée ?

cordialement

André

**kOrt3x** · 18/10/2013, 13h27

Le code HTML donne quoi ? Si tu peux nous le montrer.

**alheuredudejeuner** · 18/10/2013, 15h50

Code html :

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
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
<!DOCTYPE html>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta name="viewport" content="width=device-width, user-scalable=yes" /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>
	Tournée
</title><link type="text/css" rel="Stylesheet" href="../../Styles/Phone.css" />
</head>
<body>
    <form method="post" action="Tournee.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="ZjnEVz60zW1NYhFIvh8g6jFchEfHd2Ap092yXM33DJHpKfobm93K1JKlO36jjKJnn4gsZtahwim2+v9G52Ej1MVuqjld3rqVl1rJUYwvH97BevxO6dZwegBn1q/JtROzX1zLwl/t/FHBDk7zoMPu2IwCshFMmw/0QFQQcvHdtKwgDH/Qqu0WaKS+bReHBq9Q2iflTlsVbleffsVF4vDZgH0+tpIBcgDio6Q1tFmtUg9dxEnFCTKDtZKJoxtGII4/Z4WF0JgAxSQaegsvc7nhooMfQP9tkIXrc/322vDnPgaDiyPfD4OQIR/hSbCPVwIsMZf3aS3W8qq23mSLccK3K3tC6L5L/XUy86k+ftDwoUQV//eYlgn1xE4A4a9QyI5hHDhMzPHMzuVyV/a2mGgHK3REg2HKvz0uDxD5NPAnozZ0CtxRaY6tNDW3iGqNqBTsUmujlfnhVZekFc/7GtwT398lYFnQuHHMu9dh8Z+XDc++vn4rKLvplYRXWEcUbNmwzKouWzTx4LYpIcJ77tS7MNix/UmFCmJQt+Yu8/WLen7sbCU1tl/nHskKmdBtY6OdGSiXdJVNADlWLvn/vIrAjVp4w11hXJ0pCGWUXlgR+f/VdLBRhRx/Yi6n17t1S3laCxxkoW3yzHgPMPzncvb3FfZjoDjOBQEQ9dy516hNa2TSNq5/E4bmU2X5T2XKG6BA2OXOCj6I5m9XuuNiYMKYNsTK3+eUthAjE8aWZNmw3z48RKgXVw5vWRBulf2vvgaIcJThCdSiTRegJ17kv36uGrVZ6XBLYoBrzwvdGVPjrgok0dKiFKI5ef51vHYe2eMa2M/d0AHuMZdr15Pywn1FfRLE1Jf4UeS4L/iVNrywt1q2goDAU9FDtbQ0gy30MNbcTro/QPht+oEl1I4ug1yHOMoUQUWtBxcTwMCb4JzDqfAPSC2MAD7hUfoDHhzmiL/wRqBOFIIeZqHsIoxWOyoOrzj9m6vEi3c7OPVk4bsqopJ6wLlqm43aY40+4BENpjn2kJrEWWXnyxDNJoiV7yXV58PCC8GjHilvn9EQdxCSIrZw9fpACDSPrYtoeVeEEBgzupI5IFSwGlWqqgHv0hdRJn4oNU79gXFslXtsqHaSZeCEYo5FW9GUpsPiEZM0oXHHXBEQQohuWvGL9kIeGYgJDOJDDiZu7uaT6KLk1pCxOFhrbDy/J/UNhNFdigva9Qq9" />
</div>
 
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>
 
 
<script src="/WebResource.axd?d=pynGkmcFUV13He1Qd6_TZDE0D7sSn6mxQyDs_cFuq95l_DVNVQjT48kZN8lb1RbFnGNripgmCRYHeSsGp8sTeA2&amp;t=635119881940000000" type="text/javascript"></script>
 
 
<script src="/ScriptResource.axd?d=yeSNAJTOPtPimTGCAo3LlZQN1H-8d5Z4ynvnJfxrEPnHkM-bd6xx3tUDazxRHzo7jqAps7JH8WCiEF9ZiySvkdFdvQFx4z99Rfl0nSGAYOlfxFbzqwWphEBnBE2j6RZB0&amp;t=135ac0e7" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(Sys) === 'undefined') throw new Error('Échec du chargement de l\u0027infrastructure ASP.NET Ajax côté client.');
//]]>
</script>
 
<script src="/ScriptResource.axd?d=DT3YJR8QaqV61-teuz0hgkElyQHH-hxZK_Rg_voE5c5n8d9umziEWYGzvTP1Xa5uCJigXbzeSWsQ5tn57wkEW7i4MQ_MU9U7Lof3DZCM_2-yMeCpNKGM41oYRRnqpMmhBz5ewbFqDRN0wcTQ36iMLQ2&amp;t=135ac0e7" type="text/javascript"></script>
<div class="aspNetHidden">
 
	<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="h71wVf5YZano0l1E7BLKbOpqWvs1xTvOsWbtxOsyqDEsVFMeFVlFKO83mBHRJGiDOW+Bn0a0TgFLrcBTHNzoCed4LtSODM+M13QGDAow9QaDPK+BDSeij6liTwxP5CpcfQEkrvcw8/k1A9OxhG/01Itd32MDn6k4cpa5p/GHsLNlWZuUdKAqAca7WNBVEF1V0rLJYeObgoT6oxtBM22DIpZW+F/vFs3oDJ/WWhe1uJU0cNh3V0YoMSoRjZquL3bKP1JIoie3AETjeUwtvhbjWmzS5CgRpa4fFLzQBksir5gJQTbVeR3MHZiKFV0uKAr9HQwWgJiXA6lSkJXVkALOVSQHm8g86GXP96RJ9J0L6HxMjbtQyk/cT3D/XZ2lZyb0SufZB3hIlihoGhcnC2l+fg==" />
</div>
        <div id="entete">Vulcain Logistique</div>
        <div id="contenu">
 
 
    <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ContentPlaceHolder1$ScriptManager1', 'form1', ['tctl00$ContentPlaceHolder1$UpdatePanel1','ContentPlaceHolder1_UpdatePanel1'], [], [], 90, 'ctl00');
//]]>
</script>
 
    <div id="ContentPlaceHolder1_UpdatePanel1">
 
        <div class="Centrer">
 
 
            <br />        
            <input type="submit" name="ctl00$ContentPlaceHolder1$bPrevDate" value="&lt;&lt;" id="ContentPlaceHolder1_bPrevDate" />
            <input name="ctl00$ContentPlaceHolder1$txtDate" type="text" value="18/10/2013" id="ContentPlaceHolder1_txtDate" disabled="disabled" class="aspNetDisabled" style="width:90px;" />  
            <input type="submit" name="ctl00$ContentPlaceHolder1$bNextDate" value=">>" id="ContentPlaceHolder1_bNextDate" />
            &nbsp;<input type="submit" name="ctl00$ContentPlaceHolder1$bCalendar" value="Calendrier" id="ContentPlaceHolder1_bCalendar" style="width:70px;" />
            <br />
            <span id="ContentPlaceHolder1_lTestChauffeur">ludo</span>
 
            <table id="ContentPlaceHolder1_rbEtatLivraison" cellspacing="0" style="border-collapse:collapse;">
		<tr>
			<td><input id="ContentPlaceHolder1_rbEtatLivraison_0" type="radio" name="ctl00$ContentPlaceHolder1$rbEtatLivraison" value="Toutes" checked="checked" /><label for="ContentPlaceHolder1_rbEtatLivraison_0">Toutes</label></td><td><input id="ContentPlaceHolder1_rbEtatLivraison_1" type="radio" name="ctl00$ContentPlaceHolder1$rbEtatLivraison" value="Prêtes" /><label for="ContentPlaceHolder1_rbEtatLivraison_1">Prêtes</label></td><td><input id="ContentPlaceHolder1_rbEtatLivraison_2" type="radio" name="ctl00$ContentPlaceHolder1$rbEtatLivraison" value="Ramassées" /><label for="ContentPlaceHolder1_rbEtatLivraison_2">Ramassées</label></td>
		</tr>
	</table>
            <div id="ContentPlaceHolder1_UpdateProgress1" style="display:none;">
 
                <img id="ContentPlaceHolder1_Image1" src="../../Images/wait.gif" />
 
	</div>
        </div>
        <div>
		<table class="Grille" cellspacing="0" cellpadding="4" rules="cols" id="ContentPlaceHolder1_GridView1" style="color:Black;background-color:White;border-color:#DEDFDE;border-width:1px;border-style:None;border-collapse:collapse;">
			<tr style="color:White;background-color:#6B696B;font-weight:bold;">
				<th scope="col">ID</th><th scope="col">Ramasse</th><th scope="col">Livraison</th><th scope="col">Qté</th><th scope="col">&nbsp;</th>
			</tr><tr style="background-color:#F7F7DE;">
				<td>1</td><td>Domin,38,Saint-Andéol</td><td>Alheu,69,Meyzieu</td><td>2-450</td><td><input type="button" value=">>" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView1','Detail$0')" /></td>
			</tr><tr style="background-color:White;">
				<td>2</td><td>Alheu,69,Meyzieu</td><td>Minip,42,La Ricamarie</td><td>2-450</td><td><input type="button" value=">>" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView1','Detail$1')" /></td>
			</tr><tr style="background-color:#F7F7DE;">
				<td>5</td><td>Capta,42,Terrenoire</td><td>Bambo,13,Le Sambuc</td><td>3-600</td><td><input type="button" value=">>" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView1','Detail$2')" /></td>
			</tr><tr style="background-color:White;">
				<td>6</td><td>Bouch,69,La Mulatière</td><td>Blazi,69,Meyzieu</td><td>2-500</td><td><input type="button" value=">>" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView1','Detail$3')" /></td>
			</tr><tr style="background-color:#F7F7DE;">
				<td>3</td><td>Domin,38,Saint-Andéol</td><td>Alheu,69,Meyzieu</td><td>1-100</td><td><input type="button" value=">>" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView1','Detail$4')" /></td>
			</tr><tr style="background-color:White;">
				<td>4</td><td>Alheu,69,Meyzieu</td><td>Ceque,42,Terrenoire</td><td>1-100</td><td><input type="button" value=">>" onclick="javascript:__doPostBack('ctl00$ContentPlaceHolder1$GridView1','Detail$5')" /></td>
			</tr>
		</table>
	</div>    
 
</div>
 
        </div>
        <div id="ppage">© André Manin</div>
 
 
<script type="text/javascript">
//<![CDATA[
Sys.Application.add_init(function() {
    $create(Sys.UI._UpdateProgress, {"associatedUpdatePanelId":"ContentPlaceHolder1_UpdatePanel1","displayAfter":500,"dynamicLayout":true}, null, null, $get("ContentPlaceHolder1_UpdateProgress1"));
});
//]]>
</script>
</form>
</body>
</html>

**Torgar** · 18/10/2013, 16h04

Il faut définir une largeur sur ta div si tu veux que les marges automatiques s'appliquent. Par défaut, une div prend toute la largeur disponible.

**alheuredudejeuner** · 18/10/2013, 16h12

Optimize the order of styles and scripts (1)
The following external CSS files were included after an external JavaScript file in the document head. To ensure CSS files are downloaded in parallel, always include external CSS before external JavaScript.
1 inline script block was found in the head between an external CSS file and another resource. To allow parallel downloading, move the inline script before the external CSS file, or after the next resource.

Pour une validation http://validator.w3.org/mobile/, a priori je ne peux pas mettre de valeur.
Ce que je souhaite c'est centrer mon asp:Calendar au milieu de la div.

**alheuredudejeuner** · 18/10/2013, 16h23

l'ancienne écriture

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
            <asp:Calendar ID="Calendrier" Align="center"  runat="server" Visible="False" OnSelectionChanged="Calendar1_SelectionChanged">
            </asp:Calendar>

fonctionne au poil

André

centrer unCalendar en css

Centrer un élément en CSS

Vue hybride

Discussions similaires

Partager

Partager