vyska obsahu (html + css)

Strýco Mat · Napísal **Strýco Mat**: 24.05.2012 14:40

Dobry den, mam mensi problem s vyskou obsahu a pozadim.
Najprv hodim kod z html:

Kód:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html"; charset="UTF-8">
  <meta name="Owner " content="Strýco Mat"> 
  <meta name="Author " content="Filip Madunický (Strýco Mat)"> 
  <link rel="stylesheet" href="style.css" type="text/css">
  <title>AWAKE GAMING</title>
</head>
 <body>
  <div id="web">
   <div id="header"></div>
   <div id="menu_panel">
     <div class="menu">
      <ul>
       <li><a href="index.html" title="Novinky"><span>Novinky</span></a></li>
      </ul>
     </div>
    </div>
   <div id="obsah">
    <div class="clanky">
     <h3>Hladáme SNIPERA!!!</h3>
     <span class="vydane">Pridané: <span class="a">19.6.2012</span> | Autor: <span class="a">Strýco Mat</span></span> <br><br>
     <p>
     Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore 
      magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea 
      commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
      Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
     </p>
    </div>
   <div class="bocny-panel">
    <form>
     <input type="text" name="hladany-text">
     <input type="submit" name="hladat-text" value="Hladať">
    </form>
   </div>
   </div>
   <div id="footer"><p>&copy;2012 Strýco Mat</p></div>
  </div>
</body>
</html>

a este hodim kod z css:

Kód:

body {
   background: #222222;
}

#web {
   width: 954px;
   margin: 0 auto;
   position: relative;
   background: #666666;
   height: auto;
}

#header {
   margin: 0 0px;
   float: inherit;
   background: url('img/awake-gaming-header.png') 0 0 no-repeat;
   width: 954px;
   height: 219px;
}

#menu_panel {
   float: inherit;
   width: 954px;
   margin: -9px 0;
}

.menu ul {
   width: 954px;
   height: 29px;
   list-style-type: none;
   padding: 0 0;
   margin: 9px 0;
   background: #3a3a3a;
}

.menu ul li {
   float: left;
   display: block;
   border-right: 1px ridge #c1c1c1;
}

.menu ul li a {
   text-decoration: none;
   font-size: 13px;
   display: block;
   color: #ffffff;
   padding: 6px;
}

.menu ul li a:hover {
   text-decoration: none;
   font-size: 13px;
   display: block;
   background: #C0C0C0;
   color: #000000;
   padding: 6px;
}

#obsah {
   margin: 0 0;
   background: #666666;
   width: 954px;
   min-height: auto;
}

#obsah .clanky {
   float: left;
   padding: 0 20px 0 20px;
   margin: 0 0 0 0;
   text-align: justify;
   width: 65%;
   height: auto;
}

#obsah .clanky h3 {
   color: #fff;
   text-decoration: none;
}

#obsah .clanky .vydane {
   color: #fff;
   text-decoration: none;
   font-size: 11px;
}

#obsah .clanky .vydane .a {
   color: #333333;
   text-decoration: none;
   font-size: 12px;
}

#obsah .clanky p {
   color: #fff;
   font-size: 14px;
   font-family: Verdana;
   padding-bottom: 20px;
   border-bottom: 2px solid #444444;   
}

#obsah .bocny-panel {
   float: inherit;
   padding: 0 0 0 0;
}

#footer {
   color: #fff;
}

Co vlastne chcem ?

-chcel by som mat pozadie obsahu sede a obsah rozdelit na lavu a pravu stranu a dole footer.
-na lavej strane novinky a text stranky
-na pravej bude vyhladavanie, kontaktny formular a podobne
-a uplne dole chcem mat footer
-a aby farba pozadia lavej a pravej stranky mala rovnaku vysku pozadia samozrejme a pozadie ma byt rovnakej farby

A kde je problem ?

Tak problem je v tom, že footer mi nechce zobrazit dole ale na pravo a ked dam position a bottom tak sa len sa prehodi na druhu stranu.
No viacej uvidite ked si to ulozite u seba na pc a spustite!

Prosim poradte ako sa vysporiadat s tymto problemom alebo kde som spravil chybu ?

Za skoru odpoved vopred dakujem!

// pridané po 32 minútach od posledného príspevku

Akurat ma napadlo, ze vyenit strany a to ze lava strana bude hladanie atd a prava bude novky a text

ale je to take docasne riesenie aby na lava strana bola vyssia. Az vyriesim problem uplne dam vedet zatial neham tak lebo to neni pre mna web. D

shaggy · Napísal **shaggy**: 24.05.2012 19:23

tl;dr

Skús to ešte raz, ale tentokrát:
- popíš to zrozumiteľne, jednoducho, dvomi vetami,
- namiesto kilometru kódu daj odkaz na živú ukážku.

vyska obsahu (html + css)

Podobné témy