Guten Tag,
Es ist eine Webseite mit 4 Links und insgesamt 4 Innenseiten. In "Rezensionen" möchte ich, dass bei über den unteren Rand hinauslaufendem Text mit einem Scrollbalken ganz rechts aussen ganzseitig nach unten gescrollt wird, bis die Seite kurz nach dem Footer stoppt. Aehnlich wie bei diesen Blogs hier: https://blog4aleshanee.blogspot.ch/, https://www.favolas-lesestoff.ch/.
Hier ein Screenshot:
Hier der Code:
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head>
<title>aufwachen.ch</title><link rel="stylesheet"" type="text/css" href="style.css">
<link href="style.css" type="text/css" rel="stylesheet"></head><body style="color: rgb(0, 0, 0);" alink="#ee0000" link="#0000ee" vlink="#551a8b";>
<div class="wrapper">
<SPAN style="position: absolute; top: 78px; left: 930px;width: 34px; height: 54px"><IMG SRC="Bild Rn.jpg" ></SPAN><SPAN style="position: absolute; top: 78px; left: 950px;">
</SPAN>
<div id="header"><a><center><h1></h1><h1 style="background-color: rgb(78, 83, 93); text-align: center; margin-top: 117px; height: 37px; font-weight: bold;"><span style="font-family: Alien Encounters; color: white; font-size: 48px;">aufwachen.ch</span></h1></center></a>
<ul id="nav1"> <li class="start"><a href="#">Start</a></li> <li class="bücherverzeichnis"><a href="bücherverzeichnis.html">Bücherverzeichnis</a></li> <li class="rezensionen"><a href="rezensionen.html">Rezensionen</a></li> <li class="kontakt"><a href="kontakt.html">Kontakt</a></li>
</ul>
<div id="bild1"><img scr="" /></div>
<div id="bild2"><img src="" /></div>
<meta name="viewport" content="width=device-width, initial-scale=1"><style>.container { position: relative; text-align: center; color: white;}
.bottom-left { position: absolute; bottom: 280px; left: 525px;font-family:arial;font-size: 18px;
}
.bottom-right { position: absolute; bottom: 8px; right: 16px;}
.bücher { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family:arial; font-size: 62px; margin-top: -40px; margin-left:-24px;}</style>HTML
body {
margin: 0; padding: 0;
html {height: 100%;
}
}.wrapper { width: 1297px;
margin: 0 auto;}
a:link {text-decoration: none;color:#747474} a:visited {text-decoration: none; color: #747474} a:hover {text-decoration: none; background-color: #efefef;} a:active {text-decoration: none; background-color: #efefef}
#inhalt {width: 900px; margin-left: auto; margin-right: auto; font-family: "Trebuchet NS", Helvetica, sans-serif; letter-spacing: 4px;}
#navigation {text-align: center: font-size: 60%;}
#header {
width:1297px;height:247px;background:#4e535d;margin-left: auto; margin-right: auto;
}
#header a {background-color:4e535d;display:inline-block;margin-top:35px;margin-left:450px;}
#nav1 li a { width:15%;height:46px;display:inline-block;text-align:center;color:white;text-decoration:none;border:solid 1px #4e535d; background-color:#1e1d24;font-family:arial;float:left;margin: 21 0px 0 0;padding: 5;font-size:13px;
}
#nav1 li a:hover {
} #nav1 .start a { border-color: #4e535d;background-color: #4e535d; width: 71px; display: block; line-height:45px;} #nav1 .bücherverzeichnis a { border-color: #4e535d; margin-top:21px; width:171px; display: block; line-height:45px;} #nav1 .rezensionen a { border-color: #4e535d; margin-top:21px; width:130; display: block; line-height:45px;} #nav1 .kontakt a { border-color: #4e535d; margin-top:21px; width:103px; display: block; line-height:45px;}
#nav1 { margin-left:-40px;margin-top:15px;list-style-type: none;}
#bild1{background-color:#2e3545;width:760px;height:57px;z-index:1;margin-left: 523px;margin-top:37px;
}
#bild2{background-color:#4e535d;width:14px;height:57px;margin-left:1283px;margin-top:-57px;}
#bild3{background-color:#4e535d;width:100px;height:607px;margin-top:-607px;position:absolute;
}
#bild4{background-color:#4e535d;width:101px;height:607px;float:right;margin-left:1196px;margin-top:-607px;position:absolute;}
footer {width: 1297px;text-align:center;color:white;background-color:#4e535d;display:inline-block;font-family:arial;font-size:13px;height:85px;line-height:6em;margin-top:0px;margin-left:0px;position:absolute;}
#box { position:absolute; height: 250px; width: 800px; left: 464px; top: 337px; font-family:arial; font-size:13px; color: white; line-height:17pt;}
#box2 {width: 550px; left: 828px; top:400px; float:left; height: 200px; position:absolute;
#gross {width:1297px;height:607px;background-color:#4e535d;position:absolute;margin-top:0px;}Gruss