Hallo,
hier meine Seite:
Warum wird das CSS .myButton nicht übernommen ?
Und wie kann ich die Button auf eine immer gleiche Feste Position 1400 Pixel von oben und zentriert bringen ?
MfG Anton
hier meine Seite:
HTML:
<html>
<head>
<title>FB Profil online </title>
<script>
document.addEventListener("keydown", function(event){
if (event.keyCode == 39){
inc("out");
linkErzeugen();
}
}, false);
document.addEventListener("keydown", function(event){
if (event.keyCode == 37){
dec("out");
linkErzeugen();
}
}, false);
document.addEventListener("keydown", function(event){
if (event.keyCode == 38){
profil();
}
}, false);
document.addEventListener("keydown", function(event){
if (event.keyCode == 40){
}
}, false);
function inc(out){
field = document.getElementById(out);
field.value++;
}
function dec(out){
field = document.getElementById(out);
field.value--;
}
function profil(){
var url1 = "https://www.facebook.com/";
var eingabe = document.getElementById("out").value;
if(eingabe !== ""){
var url1 = url1 + eingabe;
document.getElementById("ZielLink1").href = url1;
document.getElementById("ZielLink1").textContent = url1;
document.getElementById("ZielLink1").click();
}
}
function linkErzeugen(){
var url = "http://graph.facebook.com/";
var anhaengen = "/picture?type=large";
var eingabe = document.getElementById("out").value;
if(eingabe !== ""){
var url = url + eingabe + anhaengen;
document.getElementById("ZielLink").href = url;
document.getElementById("ZielLink").textContent = url;
document.getElementById("ZielBild").src = url;
}
}
</script>
</head>
<body>
<div class="value-change">
<img src="" id="ZielBild"> <br><br><br><br>
<div id="box"> <div id="myButton">
<input type="text" " class="myButton" id="out" value="4" size="11" />
<button type="button" " class="myButton" id="dec" onclick="dec('out');linkErzeugen();">-</button>
<button type="button" " class="myButton" id="inc" onclick="inc('out');linkErzeugen();">+</button>
<button type="button" " class="myButton" id="profil" onclick="profil();">Profil</button>
</div>
<a id="ZielLink"style="color:black;text-decoration:none;display:none"></a> <br><br>
<a id="ZielLink1" target="_blank;display:none"></a>
<br><br> <!-- Erzeugtes Bild: -->
</div>
</body>
</html>
<style type="text/css">
BODY {
margin: 0px;
padding: 0px;
text-align: center;
}
img {
width:50%;
height:auto;
}
.box {
position: absolute;
top: 1380px;
margin-left:-50px; /* die halbe Breite */
position:absolute;
left:50%;}
}
.myButton {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background-color:transparent;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border:12px solid #dcdcdc;
display:inline-block;
cursor:pointer;
color:#777777;
font-family:Arial;
font-size:45px;
font-weight:bold;
padding:45px 45px;
text-decoration:none;
text-shadow:0px 1px 0px #ffffff;
}
.myButton:hover {
background-color:transparent;
}
.myButton:active {
position:relative;
top:1px;
}
</style>
Warum wird das CSS .myButton nicht übernommen ?
Und wie kann ich die Button auf eine immer gleiche Feste Position 1400 Pixel von oben und zentriert bringen ?
MfG Anton