Phlix: Bild/Logo fixieren bei Browserfenster-Veränderung

Beitrag lesen

SELF-Forum

Bild/Logo fixieren bei Browserfenster-Veränderung

Phlix (Versionen)
– Informationen zu den Bewertungsregeln

Guten Abend!

ich hoffe hier richtig mit meinem Problem zu sein...

folgendes: ich beschäftige mich erst seit dieser Woche mit dem Programmieren und habe mich an ein Mini-Projekt für meine Webseite gewagt...Eine einfache "Webseite im Aufbau" Webseite... unter anderem habe ich ein SSL-Logo welches sich in einem Jumbotron befindet. Soweit so gut... jetzt möchte ich aber, wenn das Browser-Fenster verkleinert wird, egal in welcher Form, dass dieses Logo IMMER rechts unten im Eck von diesem Jumbotron ist.

zzt. springt es ab einer gewissen Fensterbreite immer aus dem Jumbotron heraus...und seit 4 Stunden sitze ich recherierend da und blicke nicht mehr durch... Vielen Dank auf jedenfall für eure Hilfe und wenn ihr noch Änderungsvorschläge bzw. Verbesserungsvorschläge habt, bin ich sehr gerne dafür offen!

die Homepage wäre Meine Homepage

Grüße, PHW

<!DOCTYPE html>
<html>

<head>
    
    <title>Info!</title>
    
    <meta name="content-language" content="de" />
    
    <meta http-equiv="content-type"content="text/html; charset=utf-8">
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">

    <script src="4-jQuery/jquery-3.2.1.min"></script>
    
    <script src="4-jQuery/jQuery-ui/jquery-ui.min"></script>
    
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
    
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    
    <style type="text/css"></style>
        
    <script language="javascript" type="text/javascript"></script>
    
    <style>
    
        .jumbotron{
            position:relative;
            text-align: center;
            margin-top: 160px; 
        }
    
        #mitte{
            height: 250px;
            width:auto;
            margin-bottom: 20px;
        }
    
        .Copyright{
            float:right;
            position: inherit;
            margin-right: 50px;
            margin-top: 60px;
            font-size: 140%;
        }
    
        .SSL{
            position: inherit;
            float:right;
            margin-top:-40px;
            margin-right:-80px;
        }
        
        #logo{
            width:50%;
            height:auto;
            position:inherit;
        } 
    
    </style>
</head>

<body>
    
    <div class="container">
        <div class="jumbotron">
              <h1>Die Seite befindet sich gerade im Aufbau!</h1>

              <p>Vielen Dank für deinen Besuch auf meiner Homepage! Sie befindet sich gerade im Aufbau und wird bald fertig sein!</p>

                <img id="mitte" src="Maurer_Maxl.png">

               <p><a class="btn btn-primary btn-lg" href="https://www.google.com" data-toggle="tooltip" data-placement="bottom" title="weiter zu www.google.com" role="button">Seite verlassen!</a></p>
            
            <div class="SSL">
    
                  <a  href="https://www.checkdomain.de/unternehmen/garantie/ssl/popup/" onclick="window.open(this.href + '?host=' + window.location.host,'','height=600,width=560,scrollbars=yes'); return false;"><img id="logo" src="https://www.checkdomain.de/assets/bundles/web/backend/controller/ssl-certificate/img/ssl-150x150.png?20170622-152736" alt="SSL-Zertifikat" /></a>
    
            </div>
        </div>
    </div>
    
        <div class="Copyright">
            <p><b>&copy; PHW</b><p>
        </div>
    
</body>
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln