Bonjour,

J'ai un div qui en englobe trois et je voudrais pouvoir adapter la disposition de ceux-ci lors d'un redimensionnement de ma page (Responsive). J'ai eu beau retourner mon CSS dans tous les sens, j'ai du mal à obtenir le bon rendu.

Voici le code HTML de ma page :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
<div id="ssl_warning" class="ssl_warning">
	<asp:Label runat="server" id="ssl_warning_title" Text="<%$ Resources:ResourceEC, AttentionHttps %>" CssClass="ssl_warning_title" />
	<asp:Label runat="server" id="ssl_warning_text" Text="<%$ Resources:ResourceEC, TitreWarningHttps %>" CssClass="ssl_warning_text" />
	<asp:HyperLink runat="server" id="ssl_warning_link" Text="<%$ Resources:ResourceEC, TitreUrlProtocoleHttps %>" CssClass="ssl_warning_link" />
</div>

Et le CSS associé :

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
.ssl_warning{
    position:relative; 
    padding: 7px 7px 7px 14px; 
    background:#FCF8E3; 
    border-bottom: #ddd 1px solid;
}
 
.ssl_warning_title{
    position:absolute; 
    top:14px; 
    left:14px; 
    height: 23px; 
    padding: 6px 0 0 31px; 
    vertical-align: top; 
    background: url(Images/padlock-open.png) no-repeat left center;
    color: #B84E4E; 
    font-weight: bold; 
    font-size: 16px;
}
 
.ssl_warning_text{
    margin: 0 230px 0 125px; 
    font-size:12px;
    color:#333;
}
 
.ssl_warning_link{
    position:absolute; 
    top:14px; 
    right:14px; 
    font-size: 12px;
}
Actuellement le rendu que j'obtiens en plein écran est le suivant :

Nom : screenshot.9.jpg
Affichages : 150
Taille : 93,9 Ko

Alors que je devrais obtenir :

Nom : screenshot.10.jpg
Affichages : 160
Taille : 106,6 Ko

Merci d'avance

PS : Je teste principalement sous IE 11