Dziwne przesunięcie

pytanie zadane 10 czerwca 2016 w HTML i CSS przez BanditPlayGame Użytkownik (680 p.)
zamknięte 10 czerwca 2016 przez BanditPlayGame

HTML


<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	<title>Arduino</title>
	<meta name= "description" content="Serwis poświęcony programowaniu. Będzie także prowadzony blog na temat gier."
	<meta name="keywords" content="Programowanie, gry, C++, HTML, CSS, Arduino blog, blog o grach" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<link rel= "stylesheet" href="styleprog.css" type="text/css" />
	
	</head>

	<body>
   <div id="container">
	 
	 <div id="logo">
     Timer (Arduino)
	</div>
	
	<div id ="nav">
	
	<ol>
<li><a href="strona-internetowa-na-temat-programowania">Strona Główna</a></li>
	<li><a href="blog-na-temat-gier">Blog</a></li>
	<li><a href="programowanie-w-C-plus-plus-Css-HTML">Programy</a></li>
	<li><a href="programowanie-w-arduino">Arduino</a></li>
	<li><a href="o-mnie">O mnie</a></li>
    </div>
	</div>
	
	<div id ="navblog">

	</div>
   <div id ="content">
 <h1>Timer (Arduino)</h1>
 Tutaj będą moje wszystkie programy typu Arduino. Inne czyli tylko komputerowe typu C++ będą w zakładce Programy.
 </div>

<div style="clear:both;"></div>
	
	
	
		<div id ="footer">
	 Wszelkie Prawa Zastrzeżone &copy. 
	</div>

	</div>
	</body>
	</html>

CSS

body
{
    background-color: #414141;
}
#container
{
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

#logo
{
    text-align: center;
    margin-top: 20px;
    font-size: 44px;
    letter-spacing: 3px;
    background-color: #04382A;
    color: #2F8A72;
}

#nav
{
    color:white;
    margin-top: 20px;
    background-color: #078261;
    width:1000px;
   text-align: center;
   height: 50px;
 
   
}


#navblog
{
    float:left;
    width: 499px;
    background-color: #616059;
    height: 500px;
    text-align: center;
    border-right: 2px dotted    #195216;
}


#content
{
    float:left;
    width: 499px;
    background-color: #616059;
    height: 500px;
    text-align: center;
    font-size: 20px;
}

#footer
{
    background-color: #303030;
    padding: 10px;
    text-align: center;
}


ol
{
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-size: 25px;
  height: 50px;
    line-height: 200%;
    display: inline-block;
    
}
ol a
{
    color: #eeeeee;
    text-decoration: none;
    display: block;
}
ol > li
{
     float: left;
     width: 160px;
     height: 50px;
     border-right: 1px dashed #A6A6A6;
    
}
ol > li:first-child
{
    border-left: 1px dashed #A6A6A6;
}
ol > li:hover
{
    background-color: #000000
}

Jak na zdjęciu widać te szare bloki są przesunięte w lewo a mają być na środku i stopka jest wydłużona a ma być równa z menu na górze

komentarz zamknięcia: Wszystko już działa dziękuje wszystkim za pomoc :)

komentarz 10 czerwca 2016 przez draghan VIP (106,230 p.)

Nie napisałeś, czego oczekujesz jako rezultatu, nie opisałeś z czym konkretnie masz problem. Jeśli sam nie wiesz, z czym masz problem, to my tym bardziej.

Przy zadawaniu pytania jest prośba o wpisanie KONKRETNEGO TYTUŁU, gdzie UNIKA SIĘ słów typu "PROBLEM" czy "NIE DZIAŁA". Twój tytuł nie odnosi się do niczego użytecznego. Również przy zadawaniu pytania jest prośba o wstawianie kodu źródłowego w odpowiedni sposób.

Przeredaguj pytanie, albo zostanie usunięte.

komentarz 10 czerwca 2016 przez BanditPlayGame Użytkownik (680 p.)

O takie coś chodziło ?????

komentarz 10 czerwca 2016 przez draghan VIP (106,230 p.)

Dużo lepiej. Jeszcze kod CSS do bloczku "code", ale to już Ci poprawiłem.

Pozdrawiam.

komentarz 10 czerwca 2016 przez BanditPlayGame Użytkownik (680 p.)

Dziękuje. Mam pytanie. Właśnie chciałem dodać ten CSS do bloczku "code" tylko kiedy to zrobiłem to HTML mi zniknął. Jak to zrobić żeby były oba?

komentarz 10 czerwca 2016 przez draghan VIP (106,230 p.)

Hmm? W jednym bloczku możesz dodać tylko jeden język. Żeby mieć dwa języki osobno, dodajesz dwa osobne bloczki.

1 odpowiedź

odpowiedź 10 czerwca 2016 przez niezalogowany
wybrane 10 czerwca 2016 przez BanditPlayGame

Najlepsza

Nic tutaj dziwnego nie ma, w złym miejscu dodałeś jasno-szary content.

Zamknij listę ol i zmień miejscami jednego diva za zamkniętym wcześniej ol na miejsce przed </body>

komentarz 10 czerwca 2016 przez BanditPlayGame Użytkownik (680 p.)

Te szare bloki mają być na środku a nie są. O to mi chodzi. Ciężko mi to opisać.

komentarz 10 czerwca 2016 przez niezalogowany

http://codepen.io/anon/pen/XKXEMZ Jakbyś miał nadal problemy.

komentarz 10 czerwca 2016 przez BanditPlayGame Użytkownik (680 p.)

Wszystko działa dziękuje z pomoc :)

komentarz 10 czerwca 2016 przez niezalogowany

Tak, za wcześnie zamknąłeś <div id="container">, a dokładniej zaraz przed blokiem <div id="content"> (to jest całe 2 szare bloki + footer), co spowodowało, iż <div id="content"> nie załapał się do CSS określonego w <div id="container">