Besoin d'aide en HTML/CSS

**youness78** · 29/07/2014, 14h43

Bonjour à tous,

Je sollicite votre aide parce que je suis bloqué sur un dev que je trouve "chiant" par rapport à mon niveau en HTML/CSS mais c'est surtout mon chef qui m'énerve à rouvrir des tâches dans JIRA alors que je croyais les avoir résolues ça me gonfle bref.

Ce que je dois faire c'est mettre une bannière en haut de la page d'accueil du site indiquant à l'utilisateur qu'il se connecte en HTTP alors qu'il doit utiliser HTTPS. Passez moi les détails sur SSL et compagnie ici il ne s'agit que d'affichage !!

Pourtant voici ce que j'ai (je précise que le client s'attend à ce que le rendu soit le même sur tous les navigateurs) :

Nom : screenshot.5.jpg
Affichages : 491
Taille : 55,2 Ko

Nom : screenshot.5.jpg
Affichages : 491
Taille : 55,2 Ko

Et le code

Code html :

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

1
2
3
4
5
6
7
8
9
10
<body style="background-color: #FFFFFF;">
    <form id="form1" runat="server">
        <header>
        	<h1><asp:Image ID="logo_warningHttps" runat="server" ImageUrl="~/App_Themes/Default/Images/padlock-open.png" /></h1>
            <div id="warningHttps">
                <h2><asp:Literal ID="h2" runat="server" Text="<%$ Resources:ResourceEC, AttentionHttps %>" /></h2>
                <h3><asp:Literal ID="h3" runat="server" Text="<%$ Resources:ResourceEC, TitreWarningHttps %>" /></h3>
                <h4><asp:HyperLink ID="h4" runat="server" NavigateUrl="<%$ Resources:ResourceEC, UrlProtocoleHttps %>" Text="<%$ Resources:ResourceEC, TitreUrlProtocoleHttps %>"/></h4>
            </div>
        </header>

Code css :

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
header
{
    display:inline-block;
    width: 100%;
    height: 50px;
    font-family: Arial;
    background: beige;
}
 
@media only screen 
and (min-width : 1920px) 
{   
    header .h3
    {
        font-size: 20vw;
    }
}
 
warningHttps
{
    position: absolute;
}
 
header h1
{
    float: left;
    margin-top: 5px;
    margin-left: 20px;   
}
 
header h2
{
    float: left;
    position: absolute;
    font-family: Arial;
    font-size: 1.5em;
    font-weight: normal;
    color: Crimson;
    margin-top: 10px;
    margin-left: 60px;
}
 
header h3
{
    float: left;
    font-family: Arial;
    font-size: 1em;
    margin-top: 5px;
    margin-left: 200px;
    font-weight: normal;
}
 
header h4
{
    float: right;
    margin-top: 15px;
    margin-left: 600px;
    font-size: 0.9em;
}