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 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>
Alles anzeigen
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;}
Alles anzeigen
Gruss