• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Scrollbar einfügen

F

Factory

Neues Mitglied
Hey , bin mit meiner ersten Hp nun fast fertig :D
Hat lange gedauert und einiger hilfe bedurft.
Nur hätte ich nun gerne noch eine Scrollbar in meinem Textfeld.
Damit es immer auf der Standart Größe bleibt und bei zu langem Text
eine Scrollbar eingesetzt wird.

Hier der Code der CSS Datei:

HTML: 
html {min-height: 100%;}

* {
    margin: 0;
    padding: 0;
}

a {color: #048;}
a:hover {color: #06C;}

body {
    background: #E7E7E2 url('img/body.jpg') no-repeat center top;
    color: #444;
    font: normal 62.5% Tahoma,sans-serif;
    padding-top: 50px;
}

p,code,ul {padding-bottom: 1.2em;}

li {list-style: none;}

h1 {font: normal 1.8em Tahoma,sans-serif;}
h2 {font: bold 1.4em sans-serif;}
h3 {font: bold 1em Tahoma,sans-serif;}

form,input {margin: 0; padding: 0; display: inline;}

code {
    background: #FFF;
    border: 1px solid #EEE;
    border-left: 6px solid #CCC;
    color: #666;
    display: block;
    font: normal 1em Tahoma,sans-serif;
    line-height: 1.6em;
    margin-bottom: 12px;
    padding: 8px 10px;
    white-space: pre;
}

blockquote {
    background: url(img/quote.gif) no-repeat;
    display: block;
    font-weight: bold;
    padding-left: 28px;
}

h1,h2,h3 {padding-top: 6px; color: #553; margin-bottom: 4px;}


.clearer {clear: both; font-size: 0;}
.left {float: left;}
.right {float: right;}


.inner-container {
    border: 2px solid #D7D7D2;
    background: white ;
    font-size: 1.2em;
    margin: 0 auto;
    padding: 10px;
    width: 1000px;



}

.outer-container {
    background: url('img/container.jpg') no-repeat center bottom;
    padding-bottom: 15px;
}


.header {
    background: #222 url('img/header.jpg') no-repeat;
    height: 200px;
    margin-bottom: 5px;
    text-align: center;
}
.header .title {
    color:010101;
    padding-top: 50px;
}
.header .title .sitename a {
    border-bottom: 1px dashed ;
    color: #FFF;
    font: normal 3em sans-serif;
    padding-bottom: 2px;
    text-decoration: none;
}
.header .title a:hover {border-color: #F60;}
.header .title .slogan {
    font: normal 1.1em Verdana,sans-serif;
    padding-top: 6px;
}

.path {
    background: white;
    color: white;
    font: normal 1.1em Verdana,sans-serif;
}
.path a {
    color: #FAFAFA;
    text-decoration: none;
}
.path a:hover {
    color: #FFE;
    text-decoration: underline;
}


.main {
    background: url(img/main.gif) repeat-y;
    border-top: 1px solid #FFF;
    padding: 1px 1px 0 0;
}

.content {
    float: right;
    width: 760px;
    
}



.content .descr {
    color: #664;
    font-size: 0.9em;
    margin-bottom: 6px;

}
.content li {
    list-style: url(img/li.gif);
    margin-left: 18px;

}
.content p {font-family: "Lucida Sans Unicode",sans-serif;}


.navigation {
    float: left;
    width: 230px;
    background: white;
}
.navigation h2 {
    
    color: #5A5A43;
    font: bold 1em sans-serif;
    line-height: 30px;
    margin: 0;
    padding-left: 12px;
}
.navigation ul {
    padding: 5px;
    border-top: 5px solid white;
}

.navigation li a {
    font:bold 1em sans-serif;
    color: black;
    display: block;
    padding: 5px 0 5px 5%;
    text-decoration: none;
    width: 95%;
}
.navigation li a:hover {
    background: url(img/selected.jpg) no-repeat;;
    color: black;
    padding-left: 40px;    
}


.footer {
    background: white;
    color: black;
    font: bold 1em sans-serif;
    margin-top: 5px;
    padding: 10px 12px;
}
.footer a {
    color: black;
    text-decoration: none;
}
.footer a:hover {color: black;}
.footer .right, .footer .right a {color: black;}
.footer .right a:hover {color: black;
Und hier die HTML Datei:
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="description" content="description">
  <meta name="keywords" content="keywords">
  <meta name="author" content="author">
  <link rel="stylesheet" type="text/css" href="Style.css" media="screen">

  <title>Isis - Vom Schnee</title>

</head>

<body>

<div class="outer-container">

<div class="inner-container">

    <div class="header">
    <div class="title">

</div>
</div>

<div class="path">

     <a href="index.html"><img src="img/footer1.jpg"></a>
    <a href="index.html"><img src="img/Home_Button.jpg"></a>
    <a href="impressum.html"><img src="img/Impressum_Button.jpg"></a>
    
</div>

<div class="main">

<div class="content">                                                        
</div>

<div class="navigation">

        <h2><img src="img/navigation_1.jpg"></h2>
        <ul>
              <li><a href="news.html">News</a></li>
              <li><a href="stall.html">Der Stall</a></li>
              <li><a href="wir.html">Die Stallgemeinschaft</a></li>
        </ul>


        <h2><img src="img/navigation_2.jpg"></h2>
        <ul>
              <li><a href="ich.html">Zu meiner Person</a></li>
             <li><a href="zucht.html">Zucht</a></li>
              <li><a href="verkauf.html">Verkauf</a></li>
              <li><a href="beritt.html">Beritt &amp; Untericht</a></li>
        </ul>

    
        <h2><img src="img/navigation_3.jpg"></h2>
        <ul>
            <li><a href="bilder.html">Bildergalerie</a></li>
              <li><a href="videos.html">Videogalerie</a></li>
              <li><a href="gaestebuch.html">Gaestebuch</a></li>
              <li><a href="impressum.html">Impressum</a></li>
        </ul>


        </div>

        <div class="clearer">&nbsp;</div>

    </div>

    <div class="footer">

        <span class="left">
            &copy; 2009 <a href="index.html">isis_vomSchnee.de</a>
        </span>


        <div class="clearer"></div>

        <div class="clearer"></div>

    </div>

</div>

</div>


</body>
</html>
Hoffe ihr könnt mir helfen !
Schon mal danke im Vorraus,
LG Jonathan
 
textfelder können keine scrollbalken einthalten. textareas haben sie automatisch dabei, verstehe nicht, was dein probelm ist.

Nils aka XraYSoLo
 
Ansich ist ja gar keine Text Area Vorhanden , sondern nur das durch
CSS definierte Feld Content. Dieses ist keine Text Area sonder einfach nur ein Container . Jedenfalls dachte ich das immer :D

Und darein möchte ich nun ne Scollbar bekommen.
 
Schon mal Danke für den Hinweis .
Aber ich steh auf dem schlauch , wo soll ich das einfügen ?
Habe es in der Content Class in der CSS Datei versucht ,
aber da ändert sich nichts :(
 
entweder in die CSS-datei oder direkt in den DIV-tag als style-angabe.

HTML: 
<div style="overflow:auto;">
   content
</div>

zusätzlich muss eben noch eine feste höhe angegeben werden, damit auch tatsächlich eine scrollbar entstehen kann.

Nils aka XraYSoLo
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben