Hey,
ich bin neu hier also verzeiht wenn ich das gerade in die falsche Grp schreibe bzw. allgemein falsch hier bin.
Hab eine kleine Frage wegen einer Website an der ich gerade sitze.
Problem hierbei ist das die Startseite eine feste Position haben soll so wie ihr unten seht. Leider gibt es gerade
2 Fehler bei den ich nicht weiter komme.
Fehler 1. der Text vergrößert beim scrollen (lässt sich mit resize: none beheben soweit ich versucht habe).
Fehler 2. bei Monitoren mit einer anderen Größe drückt es arg das Layout zsm kann man das irgendwie ändern?
Hoff ich hab mich halbwegs verständlich ausgedrückt:)
Thx schon mal
_____________________________________________________________________________________________
Html5:
_____________________________________________________________________________________________
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
<div id="container10">
</div> <!-- Oberkante Header -->
<div id="container18">
<img class="anpassen" border="0" src="Bilder/Logo.jpg">
</div> <!-- Logo-->
<div id="container19">
<div class="inner">
<span>Titel</span>
</div> <!-- .inner -->
</div> <!-- Überschrift-->
</head>
<body>
<div id="container17">
<img class="anpassen" border="0" src="Bilder/Startseite.jpg">
</div> <!-- Hintergrund-->
<div id="container11">
<div class="inner">
</div> <!-- .inner -->
</div> <!-- Oberkante Body-->
<div id="container5">
<div class="inner">
</div> <!-- .inner -->
</div> <!-- Außenkante -->
<div id="container13">
<div class="inner">
<span>News</span>
</div> <!-- .inner -->
</div> <!-- .inner -->
</div> <!-- Button Rahmen News-->
<div id="container20">
<img class="anpassen" border="0" src="Bilder/Logo News.png">
</div> <!-- Logo-->
<div id="container1">
<h1>
<a id="klicker1" href="News.htm">
</a>
</h1>
</div> <!-- News Button -->
<div id="container7">
<div class="inner">
</div> <!-- .inner -->
</div> <!-- Zwischenspalte -->
<div id="container14">
<div class="inner">
<span>TV</span>
</div> <!-- .inner -->
</div> <!-- Button Rahmen TV-->
<div id="container21">
<img class="anpassen" border="0" src="Bilder/Logo TV.png">
</div> <!-- Logo-->
<div id="container2">
<h1>
<a id="klicker1" href="TV.htm">
</a>
</h1>
</div> <!-- TV Button -->
<div id="container8">
<div class="inner">
</div> <!-- .inner -->
</div> <!-- Zwischenspalte -->
<div id="container15">
<div class="inner">
<span>Filliale</span>
</div> <!-- .inner -->
</div> <!-- Button Rahmen Filliale-->
<div id="container22">
<img class="anpassen" border="0" src="Bilder/Logo Filliale.png">
</div> <!-- Logo-->
<div id="container3">
<h1>
<a id="klicker1" href="Filliale.htm">
</a>
</h1>
</div> <!-- Filliale Button-->
<div id="container9">
<div class="inner">
</div> <!-- .inner -->
</div> <!-- Zwischenspalte -->
<div id="container16">
<div class="inner">
<span>Kontakt</span>
</div> <!-- .inner -->
</div> <!-- Button Rahmen Kontakt-->
<div id="container23">
<img class="anpassen" border="0" src="Bilder/Logo Kontakt.png">
</div> <!-- Logo-->
<div id="container4">
<h1>
<a id="klicker1" href="Kontakt.htm">
</a>
</h1>
</div> <!-- Kontakt Button-->
<div id="container6">
<div class="inner">
</div> <!-- .inner -->
</div> <!-- Außenkante-->
<div id="container12">
<div class="inner">
<span>
<br>Anschrift
<br>Telefon
<br>Blub
</span>
</div> <!-- .inner -->
</div> <!-- Unterkante-->
<div class="clear"> </div>
</body>
</html>
____________________________________________________________________________________________________
CSS
____________________________________________________________________________________________________
* {
margin: 0;
padding: 0;
}
.inner {
padding: 10px;
}
.clear {
clear: both;
}
.anpassen {
height: 100%;
width: 100%;
}
#textarea {
resize: none;
}
/*-------------------------------------Startseite--------------------------------------*/
#klicker1 { /*Button Klick Auslöser*/
position: absolute;
height:100%;
width: 100%;
opacity: 0;
}
#container1 { /*Hintergrund Button News*/
background: FFFFFF;
position: absolute;
top: 20%;
left: 25.25%;
height:59%;
width: 12%;
opacity: 0;
}
#container2 { /*Hintergrund Button TV*/
background: FFFFFF;
position: absolute;
top: 20%;
left: 37.75%;
height:59%;
width: 12%;
opacity: 0;
}
#container3 { /*Hintergrund Button Filliale*/
background: FFFFFF;
position: absolute;
top: 20%;
left: 50.25%;
height:59%;
width: 12%;
opacity: 0;
}
#container4 { /*Hintergrund Button Kontakt*/
background: FFFFFF;
position: absolute;
top: 20%;
left: 62.75%;
height:59%;
width: 12%;
opacity: 0;
}
#container5 { /*Außenkante Links*/
background: #f8f8f8;
position: absolute;
top: 14%;
left: 0%;
height:65%;
width: 25.25%;
}
#container6 { /*Außenkante Rechts*/
background: #f8f8f8;
position: absolute;
top: 14%;
left: 74.75%;
height:65%;
width: 25.25%;
}
#container7 { /*Zwischenspalte 1*/
background: #f8f8f8;
position: absolute;
top: 20%;
left: 37.25%;
height:59%;
width: 0.5%;
}
#container8 { /*Zwischenspalte 2*/
background: #f8f8f8;
position: absolute;
top: 20%;
left: 49.75%;
height:59%;
width: 0.5%;
}
#container9 { /*Zwischenspalte 3*/
background: #f8f8f8;
position: absolute;
top: 20%;
left: 62.25%;
height:59%;
width: 0.5%;
}
#container10 { /*Oberkante Header*/
background: white;
position: absolute;
top: 0%;
left: 0%;
height:14%;
width: 100%;
}
#container11 { /*Oberkante Body*/
background: #f8f8f8;
position: absolute;
top: 14%;
left: 25.25%;
height:6%;
width: 49.5%;
}
#container12 { /*Unterkante*/
background: white;
position: absolute;
top: 79%;
left: 0%;
height:21%;
width: 100%;
text-align: center;
font-size: 85%;
color: #848079;
font-family: 'Times New Roman';
}
#container13 { /*Button News*/
background: #45BA01;
position: absolute;
top: 61%;
left: 25.25%;
height:8%;
width: 12%;
text-align: right;
font-size: 200%;
color: white;
font-family: 'Times New Roman';
}
#container14 { /*Button TV*/
background: #45BA01;
position: absolute;
top: 61%;
left: 37.75%;
height:8%;
width: 12%;
text-align: right;
font-size: 200%;
color: white;
font-family: 'Times New Roman';
}
#container15 { /*Button Filliale*/
background: #45BA01;
position: absolute;
top: 61%;
left: 50.25%;
height:8%;
width: 12%;
text-align: left;
font-size: 200%;
color: white;
font-family: 'Times New Roman';
}
#container16 { /*Button Kontakt*/
background: #45BA01;
position: absolute;
top: 61%;
left: 62.75%;
height:8%;
width: 12%;
text-align: left;
font-size: 200%;
color: white;
font-family: 'Times New Roman';
}
#container17 { /*Hintergrund*/
position: absolute;
top: 20%;
left: 25.25%;
height: 59%;
width: 49.5%;
}
#container18 { /*Logo*/
position: absolute;
top: 1%;
left: 22.5%;
height: 12%;
width: 12%;
}
#container19 { /*Überschrift*/
position: absolute;
top: 2.5%;
left: 0%;
height: 10%;
width:100%;
text-align:center;
font-size: 230%;
color: black;
font-family: 'Times New Roman';
}
#container20 { /*Logo News*/
position: absolute;
top: 62%;
left: 25.25%;
height: 6%;
width: 3%;
}
#container21 { /*Logo TV*/
position: absolute;
top: 62%;
left: 37.75%;
height: 6%;
width: 3%;
}
#container22 { /*Logo Filliale*/
position: absolute;
top: 62%;
left: 59.25%;
height: 6%;
width: 3%;
}
#container23 { /*Logo Kontakt*/
position: absolute;
top: 62%;
left: 71.75%;
height: 6%;
width: 3%;
}
/*-----------------------------------------News-----------------------------------------*/