Witajcie. Mam do was pytanie. Mój problem polega na tym że nie moge przesunąć elementu. Nie działają mi marginy. Chodzi mi o ten element.
Kod HTML:
<! DOCTYPE HTML>
<html lang="PL">
<head>
<meta charset="UTF-8" />
<title>Wizytówka</title>
<meta name="description" content="Strona poświęcona miastu Wieluń" />
<meta name="keywords" content="miasto, Wieluń, łodzkie, wieluńskie, wizytówka" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Lato:400,700&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
</head>
<div id="container">
<div id="nav">Witaj na stronie poświęconej miastu Wieluń</div>
<div id="nav1">
<ol>
<li><a href="index.html">Strona Główna</a></li>
<li><a href="aktu.html">Aktualności</a></li>
<li><a href="kontakt.html">Kontakt</a></li>
<li><a href="forum/index.php">Forum</a></li>
<li><a href="info.html">Informacje</a>
<li><a href="formularze-support-donate">Forumualrze</a></li>
</ol>
</div>
<div id="content">
<span id="box">Witaj na stronie</span>
</div>
<div id="footer">
<div id="logo">
<img src="img/herb.png" height="200px" style="float: left;"><span id="logotyp">Wieluń<span> <br />
</div>
<div id="content1">
<strong>Urząd Gminy Wieluń</strong> <br />
ul. Bolesława Prusa 8 <br />
98-432 Wieluń <br />
Telefony: 84 6962681, 84 6962025 <br />
Fax: 84 6962794 <br />
NIP: 919-13-65-265 <br />
REGON: 000545722 <br />
</div>
<div id="content2">
<strong>Copyright © 2015 Urząd Gminy Wieluń.</strong> <br />
Wszelkie prawa zastrzeżone. <br />
Wszelkie przepisy prawa podane na tej <br />
stronie mają charakter informacyjny <br />
i nie stanowią wykładni prawa.
</div>
<div style="clear:both;"></div>
</div>
</div>
<script>
$(document).ready(function() {
var stickyNavTop = $('#nav1').offset().top;
var stickyNav = function(){
var scrollTop = $(window).scrollTop();
if (scrollTop > stickyNavTop) {
$('#nav1').addClass('sticky');
} else {
$('#nav1').removeClass('sticky');
}
};
stickyNav();
$(window).scroll(function() {
stickyNav();
});
});
</script>
<body>
</body>
</html>
CSS:
body {
margin: 0 !important;
font-size: 20px;
color: #FFFFFF;
font-family: 'Lato', sans-serif;
background-image: url(img/wielun.png);
background-repeat:no-repeat;
background-position: center;
width: 100%;
}
#container {
margin-right: 0;
margin-left: 0;
}
#nav {
background-color: black;
text-align: center;
padding: 10px;
width: 99,5%;
}
#nav1 {
background-color: black;
text-align: center;
padding: 15px;
width: 99,5%;
opacity: 0.75;
}
ol {
list-style-type: none;
height: 47px;
line-height: 200%;
display: inline-block;
margin: 0;
font-size: 24px;
}
ol a {
color: white;
text-decoration: none;
display: block;
}
ol > li {
float: left;
width: 200px;
border: 5px solid rgba(0,0,0,0);
}
ol > li:hover {
border: 5px solid #fff;
}
#footer {
background-color: #cdc3a9;
padding: 40px;
height: 200px;
color: black;
text-align: justify;
}
#logo {
width: 40%;
border-right: 3px dotted #bcdb298;
float: left;
}
.sticky {
width: 100%;
top: 0;
left: 0;
z-index: 100;
position: fixed;
}
#content2 {
float: right;
}
#content1 {
float: left;
}
#logotyp {
float: left;
font-size: 48px;
font-weight: bold;
margin-left: 15px;
margin-top: 50px;
}
#box {
border: 2px solid #c1aa77;
width: 100px;
height: 100px;
padding: 15px;
color: #c1aa77;
text-align: center;
font-size: 24px;
}
#content {
height: 620px;
width: 100%;
}