2017-11-16 8 views
0

Wenn eine Größe des Bildschirms ändern, erhalten Sie den Text eine andere Größe. Ich möchte dies vermeiden und eine Bildlaufleiste anzeigen. Könnten Sie mir bitte helfen?Vermeiden Sie die Größe eines Abschnitts zu ändern, während Sie die Größe des Bildschirms ändern

Dies ist mein Code:

article { 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 

 
section.apropos { 
 
    background-color: white; 
 
    color: #666666; 
 
    font-family: Calibri; 
 
    height: 100%; 
 
    width: auto; 
 
    padding-top: 95px; 
 
    padding-left: 20%; 
 
    padding-right: 20%; 
 
    text-align: justify; 
 
    min-width: auto; 
 
    min-height: auto; 
 
}
<header> 
 
    <nav> 
 
    <ul> 
 
     <li><a> Notre entreprise</a></li> 
 
     <li class="m"><a> Nous connaitre</a></li> 
 
     <li class="m"><a onclick='onLinkClick()'>Nos métiers</a></li> 
 
     <li class="m"><a>Nous contacter</a></li> 
 
    </ul> 
 
    </nav> 
 
</header> 
 

 
<body> 
 
    <article> 
 

 
    <section class="apropos"> 
 
     <h1> A PROPOS DE NOUS </h1> <br/> 
 
     <p> Lorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consectetur</p> 
 

 
     <p> Lorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consectetur Lorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consectetur</p> 
 
    </section> 
 

 
    <section class="NotreMetier" id="NotreMetier"> 
 

 
    </section> 
 

 
    </article> 
 
</body>

Vielen Dank im Voraus.

+0

3 mal für mein Englisch leider? Wenn SO Ihnen sagt, dass Sie mehr "Text" hinzufügen sollen, sollten Sie Ihr Problem klären, nicht den gleichen Text immer wieder posten, um den Code an die Textration anzupassen ... –

+0

verwenden Sie einfach eine feste Breite –

Antwort

0

Verwenden Sie width: und , um es zu beheben (400px und 300px in meinem Beispiel). Verwenden Sie optional overflow: scroll;, um Ihrem Element Bildlaufleisten zu geben, wenn der Inhalt größer als seine Größe ist.

article { 
 
    width: 400px; 
 
    height: 300px; 
 
    overflow: scroll; 
 
} 
 

 
section.apropos { 
 
    background-color: white; 
 
    color: #666666; 
 
    font-family: Calibri; 
 
    width: auto; 
 
    padding-top: 95px; 
 
    padding-left: 20%; 
 
    padding-right: 20%; 
 
    text-align: justify; 
 
}
<body> 
 
<header> 
 
    <nav> 
 
    <ul> 
 
     <li><a> Notre entreprise</a></li> 
 
     <li class="m"><a> Nous connaitre</a></li> 
 
     <li class="m"><a onclick='onLinkClick()'>Nos métiers</a></li> 
 
     <li class="m"><a>Nous contacter</a></li> 
 
    </ul> 
 
    </nav> 
 
</header> 
 
    <article> 
 

 
    <section class="apropos"> 
 
     <h1> A PROPOS DE NOUS </h1> <br/> 
 
     <p> Lorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consectetur</p> 
 

 
     <p> Lorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consectetur Lorem ipsum dolor sit amet consecteturLorem ipsum dolor sit amet consectetur</p> 
 
    </section> 
 

 
    <section class="NotreMetier" id="NotreMetier"> 
 

 
    </section> 
 

 
    </article> 
 
</body>

Verwandte Themen