uhura: scrollbar - wenn auch unschön

Beitrag lesen

SELF-Forum

scrollbar - wenn auch unschön

uhura
– Informationen zu den Bewertungsregeln

Hallo,

ich finde eine simple Funktion nicht: wie kann ich eine
einfache Scrollbar einbauen?

Im folgenden mal der Aufbau meiner Datei:

<html>
<head>
<title>leer</title>
<link href="zentriert.css" rel="stylesheet" type="text/css">
</head>

<body>

<div class="container">
<div class="box1">
<a href="http://www.youtube.com/">Youtube</a>
<a href="http://www.google.de/">Google</a>
<a href="http://www.wikipedia.org/">Wikipedia</a>
<a href="http://www.ebay.de/">ebay</a>
</div>

<div class="box2"><img class="bla" src="zitrone_web.jpg"><p>Bllindtext ausdr&uuml;cklich m&ouml;chten.</p></div>

<div class="box3"><img src="nuss_web.jpg"><p>Hier steht der Text &uuml;ber N&uuml;sse</p></div>

<div class="box4"></div>
<div class="box5"></div>

</div>

</body>
</html>

_______________________(css)_____________________________________

/*hintergrund*/
body
{
background: #000 url(verlauf.jpg) repeat-x top;
font-family:"verdana";
text-align: left;
color:#575757;
}

img {
/*margin: 4 0 10px 0;*/
width:260px;
}

.bla {
width:390px;
height: 140px;
}

p {
margin:10px 0 0 0;
}

/*linke Box*/
.box1
{
position:absolute;
top:180px;
left:30px;
width:150px;
height:478px;
z-index:1;
border:solid 1px grey;
background: #EDEDED;
}

/*mittlere Box*/
.box2
{
position:absolute;
top:180px;
left:210px;
width: 395px;
height:458px;
z-index:2;
border:solid 1px grey;
background: #EDEDED;
padding:10px;
}

/*rechte Box*/
.box3
{
position:absolute;
top:180px;
left:656px;
width:263px;
height:458px;
z-index:3;
border:solid 1px grey;
background: #EDEDED;
padding:10px;
}

/*header*/
.box4
{
position:absolute;
top:0px;
left:30px;
width:910px;
height:150px;
z-index:4;
border:solid 1px grey;
background: #EDEDED url(zitrone_web_kachel.jpg) repeat-x;
}

/*header*/
.box5
{
position:absolute;
top:680px;
left:30px;
width:910px;
height:80px;
z-index:4;
border:solid 1px grey;
background: #EDEDED url(zitrone_web_kachel.jpg) repeat-x;
}

/*container*/
.container
{
margin-left:auto;
margin-right:auto;
position:relative;
top:10px;
width:980px;
height:570;
}

/* Hier kommt CSS für die links */

a:link
{
color:#000000;
background-color:#C3CD2E;
font-family:Verdana;
font-size:15px;
display:block;
border:solid 1px grey;
margin-top:-1px;
margin-left:-1px;
margin-right:-1px;
padding:4px;
text-decoration:none;
border:solid 1px gey;
}

a:visited  /*besucht*/
{
color:#000000;
background-color:#C3CD2E;
font-family:Verdana;
font-size:15px;
display:block;
border:solid 1px grey;
margin-top:-1px;
margin-left:-1px;
margin-right:-1px;
padding:4px;
text-decoration:none;
}

a:hover /*mouse-over*/
{
color:#000000;
background-color:#ffffff;
font-family:Verdana;
font-size:15px;
display:block;
border:solid 1px grey;
margin-top:-1px;
margin-left:-1px;
margin-right:-1px;
padding:20px;
text-decoration:none;
}

a:active
{
color:#000000; /*schriftfarbe*/
background-color:#ffffff;
font-family:Verdana;
font-size:15px;
display:block;
border:solid 1px grey;
margin-top:-1px;
margin-left:-1px;
margin-right:-1px;
padding:4px;
text-decoration:none;
}

Alle nicht soooo wichtig. Aber danke schon mal für Ideen
und Anregungen!
Grüßle

Beitrag melden
–
Informationen zu den Bewertungsregeln