Autor Zpráva
Ameopro
Profil
#1 · Zasláno: 20. 6. 2014, 22:18:02 · Upravil/a: Moderátor (editace znemožněna) 21. 6. 2014, 21:48:06
Odpovědět Citovat
Ahoj te prosím vás když vám pošlu soubory webu skouknete to někdo proč to dělá chybu když nastavím Height Auto ; ??
Mám to přes div ktery je takto .:: 


<div class="texture"><!--- Levá i pravá strana Pole na TXT---->                         
<div class="texture-align"><!--- Zarovnávání Textu---->                      
<div class="left"><?php include('file/inc.left.php')?></div><!--- Levá strana Pole na TXT---->    
<div class="right"><?php include('file/inc.right.php')?></div><!--- Pravá strana Pole na TXT---->
</div><!--- Zakončení zarovnávání textu---->


CSS :

.texture{
background-image: url("img/texture.png");
width: 1000px;
height: 700px;
} 

.texture-align{margin-left: 15px; 
               position:relative; 
               top: 10px;
}

.left{position:relative; 
      float:left; 
      width: 250px; 
      }
.right{position:relative; 
      float:left; 
      width: 660px; 
      margin-left: 50px;
      }

Náhled na www : test.financni-uvery.cz
Taurus
Profil
#2 · Zasláno: 20. 6. 2014, 22:58:22
Odpovědět Citovat
Podí vejse na tyto strán ki.:.. Povídání o živých ukázkách
Sennin
Profil
#3 · Zasláno: 21. 6. 2014, 11:03:51 · Upravil/a: Sennin 21. 6. 2014, 14:46:06
Odpovědět Citovat
Nazdar Taurus: <!-- Ospravedlňujem sa zle meno pre odpoveď.
Správne malo byť Nazdar Ameopro
Prosím ťa buď tak dobrý a pozri si zdrojový kód svojej stránky a potom sa pozri aj na CSS :)

ale teraz k veci upravil som tvoj html pretože 
<!DOCTYPE HTML>
<html>
<head>
...
</head>
<body>
....
</body>
</html>

Je asi zložité čo :)
A ešte aby som nezabudol ak komentuješ v HTML tak je to <!-- Komentár --> a nie <!---- Komnetár ----> dávajú sa len dve
Upravený HTML 
<!DOCTYPE html>
<html lang="sk">
  <head>
    <meta charset="utf-8">
    <title>Endless Admin</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
  </head>
 <body>

<div style=" background-color:#FFFFFF; font-size: px;"><div class="souhrn">Vyzkoušejte nový webhosting <a href="http://b.cz/">b.cz</a>. Nejkratší doména 2. řádu na českém trhu.</div></div>

<div class="right_left"> <!-- Zarovnávání webu do prostřed -->
<div class="header"><div class="header-top"><img src="images/logo.png" width="600px" height="253px"></div></div><!-- TOP Image + Nadpis webu -->
<div class="lish"></div> <!-- zelená lišta pod Headerem (top) -->

<div class="texture"><!-- Levá i pravá strana Pole na TXT -->
<div class="texture-align"><!-- Zarovnávání Textu -->
<div class="left"><input type="text" name="Search">
<a href="#"><input type="submit" name="submit" value="Hledat" id="image-button"></a>

<div class="menu">
<li><a href="#">Menu</a></li>
<li><a href="#">List</a></li>
<li><a href="#">Update</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">List</a></li>
<li><a href="#">Update</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">List</a></li>
<li><a href="#">Update</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">List</a></li>
<li><a href="#">Update</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Menu</a></li>
<li><a href="#">List</a></li>
<li><a href="#">Update</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Menu</a></li>

</div></div><!-- Levá strana Pole na TXT -->
<div class="right"><h2>Themes by Amik v 0.0.4</h2>
<p>Ut vitae lacus quis orci malesuada congue non in leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque imperdiet, nisi sit amet venenatis vestibulum, mi mi commodo quam, eget porta risus orci eu lorem. Praesent nec velit nulla, id porta tellus. Curabitur ac urna non augue dapibus dapibus a in ante. Nunc sed lorem felis, at luctus felis.

Proin sit amet urna sed dolor ullamcorper blandit. Etiam blandit bibendum nisl, eleifend volutpat tellus vestibulum vitae. Fusce interdum commodo ligula sit amet cursus. In sit amet magna id quam suscipit condimentum.</p>

<p>Ut vitae lacus quis orci malesuada congue non in leo. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque imperdiet, nisi sit amet venenatis vestibulum, mi mi commodo quam, eget porta risus orci eu lorem. Praesent nec velit nulla, id porta tellus. Curabitur ac urna non augue dapibus dapibus a in ante. Nunc sed lorem felis, at luctus felis.

Proin sit amet urna sed dolor ullamcorper blandit. Etiam blandit bibendum nisl, eleifend volutpat tellus vestibulum vitae. Fusce interdum commodo ligula sit amet cursus. In sit amet magna id quam suscipit condimentum.</p></div><!-- Pravá strana Pole na TXT -->
</div><!-- Zakončení zarovnávání textu -->


</div><!-- Zakončení texture -->
<div class="footer"> <div class="footer_center">Music Channel 2014& 2014 Všechna práva vyhrazena Ameopro</div></div><!-- Spodní část webu -->

</div><!-- right_left texture -->

  </body>
</html>

A CSS 
body{
background-image: url("http://test.financni-uvery.cz/img/background.png");
background-color: #000;
}

.right_left{
margin-left: 10%;
margin-right: 10%;
}

.header{
background-image: url("../images/header.png");
width: 1000px;
height: 250px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
color: #FFFFFF;
}
.lish{
background-image: url("http://test.financni-uvery.cz/img/lish.png");
width: 1000px;
height: 10px;
}
.texture{
background-image: url("../images/texture.png");
width: 1000px;
float: left;
height: 100%;
}
.footer{
background-image: url("http://test.financni-uvery.cz/img/lish.png");
width: 1000px;
height: 70px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
text-align: center;


}

.texture-align{margin-left: 15px;
               position:relative;
               top: 10px;
}

input#image-button{
background-image: url("http://test.financni-uvery.cz/img/button.png");
width: 80px;
height: 23px;
position:relative;
right:2px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
color: #FFFFFF;
}

.left{position:relative;
      float:left;
      width: 250px;
      }
.right{position:relative;
      float:left;
      width: 660px;
      margin-left: 50px;
      }
.menu{background-image: url("../images/header.png");
      width: 240px;
      position: relative;
      margin: 50px 0;
      border-bottom-right-radius: 10px;
      border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
      border-top-left-radius: 10px;
      color: #FFFFFF;
      float: left;
      height: auto;
      padding: 10px;
      }

h2{text-decoration: underline;}
a {color: #FFFFFF;
  text-decoration: none;}


.header-top{position:relative; top: 30px; left: 55px; font-size: 22px;}
li{position:relative; left: 20px; }

.footer_center{position:relative; top: 20px;}

Samozrejme v css si uprav cesty k tvojím obrázkom ja som sa snažil len na nich napojiť
Ameopro
Profil
#4 · Zasláno: 21. 6. 2014, 14:28:43
Odpovědět Citovat
Jestli mužete koukněte na ukázku co to dělá dal jsem height: 100%; ale i tak to menu nereaguje na to jak je velká ta stránka
Tomáš123
Profil
#5 · Zasláno: 21. 6. 2014, 14:38:49
Odpovědět Citovat
Ameopro:
Ty chceš, aby sa stránka natiahla podľa dĺžky menu?
Ameopro
Profil
#6 · Zasláno: 21. 6. 2014, 14:42:27
Odpovědět Citovat
Ano
Sennin
Profil
#7 · Zasláno: 21. 6. 2014, 14:50:55
Odpovědět Citovat
Ameopro:
A ten môj príspevok vyššie nepomohol?
Ameopro
Profil
#8 · Zasláno: 21. 6. 2014, 14:52:09
Odpovědět Citovat
Sennin ( použil jsem ale nefunguje to furt se to neřídí velikostí menu
Tomáš123
Profil
#9 · Zasláno: 21. 6. 2014, 14:58:00
Odpovědět Citovat
Ameopro:
Používaš float (táto vlastnosť vyjme prvky z toku dokumentu),
Skús pridať na koniec do divu s triedou texture-align nový div s triedou clear, ktorý hneď aj ukončíš.
HTML bude vyzerať asi takto: 
<div class="texture-align"><!--- Zarovnávání Textu---->                      
  <div class="left"></div><!--- Levá strana Pole na TXT---->    
  <div class="right">/div><!--- Pravá strana Pole na TXT---->
  <div class="clear"></div>
</div>

A do CSS pridaj: 
.clear {clear: both;}
Sennin
Profil
#10 · Zasláno: 21. 6. 2014, 14:58:36
Odpovědět Citovat
Ameopro:
Tak si skopíruj môj kód znova komplet celý aj s CSS pretože mňe to funguje ak s tým dlhým menu
a ešte som zabudol namiesto 
<div class="menu"></div>
Daj 
<ul class="menu"></ul>

Ale aj tak to funguje
Tomáš123
Profil
#11 · Zasláno: 21. 6. 2014, 14:59:10
Odpovědět Citovat
Ameopro:
Mohla by ti pomôcť aj táto jednoduchá schéma stránky: http://qu.wu.cz/webtest/jednoduche-schema-stranky.htm.

Je to príklad dvojstĺpcového layoutu s použitím obrázka.
Ameopro
Profil
#12 · Zasláno: 21. 6. 2014, 15:12:41
Odpovědět Citovat
Sennin Co jsi měnil v tom CSS ??
Sennin
Profil
#13 · Zasláno: 21. 6. 2014, 15:24:23
Odpovědět Citovat 
body{
background-image: url("http://test.financni-uvery.cz/img/background.png");
background-color: #000;
}
 
.right_left{
margin-left: 10%;
margin-right: 10%;
}
 
.header{
background-image: url("../images/header.png");
width: 1000px;
height: 250px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
color: #FFFFFF;
}
.lish{
background-image: url("http://test.financni-uvery.cz/img/lish.png");
width: 1000px;
height: 10px;
}
.texture{
background-image: url("../images/texture.png");
width: 1000px;
float: left;
height: 100%;
}
.footer{
background-image: url("http://test.financni-uvery.cz/img/lish.png");
width: 1000px;
height: 70px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
text-align: center;
 
 
}
 
.texture-align{margin-left: 15px;
               position:relative;
               top: 10px;
}
 
input#image-button{
background-image: url("http://test.financni-uvery.cz/img/button.png");
width: 80px;
height: 23px;
position:relative;
right:2px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
color: #FFFFFF;
}
 
.left{position:relative;
      float:left;
      width: 250px;
      }
.right{position:relative;
      float:left;
      width: 660px;
      margin-left: 50px;
      }
.menu{background-image: url("../images/header.png");
      width: 240px;
      position: relative;
      margin: 50px 0;
      border-bottom-right-radius: 10px;
      border-top-right-radius: 10px;
      border-bottom-left-radius: 10px;
      border-top-left-radius: 10px;
      color: #FFFFFF;
      float: left;
      height: auto;
      padding: 10px;
      }
 
h2{text-decoration: underline;}
a {color: #FFFFFF;
  text-decoration: none;}
 
 
.header-top{position:relative; top: 30px; left: 55px; font-size: 22px;}
li{position:relative; left: 20px; }
 
.footer_center{position:relative; top: 20px;}
Ameopro
Profil
#14 · Zasláno: 21. 6. 2014, 15:30:52
Odpovědět Citovat
Vyřešeno díky moc chyba byla v tom že sem nedal margin: 50px 0
;
Časová prodleva: 10 let

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0