Nie wiem czy to forum jest przeznaczone do rozwiazywania tak błahych problemów, jednak mam z tym troszkę problemem a muszę wykonać pracę na informatykę a mam troszkę kłopot.
Chce aby moj szablon mial szerokosc 800 pixeli, jednak menu majac 800 pixeli zjeżdża w dol , rozwala sie, przez co pasek jest krotszy od loga co źle wyglada ;//
tło na logo ma również 800x400 px, jednak widać tylko około 50 pixeli na którym pojawia sie tekst.
Siedziałem bardzo długo na googlach ale tych komend do css jest bardzo dużo i kombinacje ktorych probowalem nie dzialaja, wrecz pogarszaja sprawe.
Kieruje prosbe o pomoc do was, iz wiem że tutaj każdy uzytkownik posiada wiedze dostateczna, aby w sekundke dostrzec rozwiazanie
Proszę mnie nie krytykować wiem że jestem noob, ale ciagle sie ucze i nie trace nadziei ze kiedys bede w tym dobry ;DDD
Pod menu ma byc rowniez pole tresci oraz stopka, wiec przy okazji moze ktos ma jakies wskazowki jakie kroki dlaej poczynić aby zrobic to dobrze.
Chce aby moje pole div miala wysokosc taka jaka sobie zycze i elementy nie rozłaziły sie , gdy tabelka jest 800 to mają w jednej linii być 4 przyciski menu po 200 ! wlasnie takie cos chce tutaj zrobic.
I również w polu div logo chce w prawym gornym rogu dac ikonke koperty malej np i zeby to byl odnosik do wyslania do mnie maila, takie jak sa na lepszych stronach takie elementy
.Chłopaki tylko prosze o wyrozumialosc ucze sie i staram sie w granicach mozliwosci wszystko odnajdywac na kursach internetowych i tutorialach,
I to jest wlasnie wynik mojej nauki z tutoriali. No ale napisalem tu z nadzieja ze ktos udzieli malej rady, jesli ma moze czas i ochotę żeby pomóc bo nic na siłe 
Z góry wielkie dzieki Pozdrowionka
Piszę strone w htmlu i css : tu załączam kodzik:
Tutaj mam kod html
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="a1">
<div id="logo"><h2><font color="red">Przykładowa strona</font></h2></div>
<div id="menu_zawartosc">
<ul id="menu">
<li class="link_strzalka_dol"><a href="#">Aparaty<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]>
<table>
<tr>
<td>< ![endif]-->
<ul>
<li><a href="#" class="link">analogowe</a></li>
<li><a href="#" class="link">cyfrowe</a></li>
<li><a href="#" class="link">kompaktowe</a></li>
</ul>
<!--[if lte IE 6]></td>
</tr>
</table>
< ![endif]-->
</li>
<li class="link_strzalka_dol"><a href="#">Skanery<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]>
<table>
<tr>
<td>< ![endif]-->
<ul>
<li><a href="#" class="link">płaskie</a></li>
<li><a href="#" class="link">bębnowe</a></li>
<li><a href="#" class="link">ręczne</a></li>
</ul>
<!--[if lte IE 6]></td>
</tr>
</table>
< ![endif]-->
</li>
<li><a href="#" class="link">About</a></li>
<li><a href="#" class="link">Kontakt</a></li>
</ul>
</div>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="a1">
<div id="logo"><h2><font color="red">Przykładowa strona</font></h2></div>
<div id="menu_zawartosc">
<ul id="menu">
<li class="link_strzalka_dol"><a href="#">Aparaty<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]>
<table>
<tr>
<td>< ![endif]-->
<ul>
<li><a href="#" class="link">analogowe</a></li>
<li><a href="#" class="link">cyfrowe</a></li>
<li><a href="#" class="link">kompaktowe</a></li>
</ul>
<!--[if lte IE 6]></td>
</tr>
</table>
< ![endif]-->
</li>
<li class="link_strzalka_dol"><a href="#">Skanery<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]>
<table>
<tr>
<td>< ![endif]-->
<ul>
<li><a href="#" class="link">płaskie</a></li>
<li><a href="#" class="link">bębnowe</a></li>
<li><a href="#" class="link">ręczne</a></li>
</ul>
<!--[if lte IE 6]></td>
</tr>
</table>
< ![endif]-->
</li>
<li><a href="#" class="link">About</a></li>
<li><a href="#" class="link">Kontakt</a></li>
</ul>
</div>
</div>
</body>
</html>
a tutaj css
CODE
body { /* nasza cala strona */
background-color: #FFFFFF; /* kolor strony */
font-family: Verdana, Sans-serif; /* krój czcionki */
font-size: 15px; /* rozmiar czcionki */
display: inline;
width:800px;
text-align: center;}
#logo
{
position:relative;
margin:auto; height:400; text-align: center; width:800px; background-image:url(images/logo.jpg)}
#menu_zawartosc {margin:auto; position:relative; width:800px; height:25px; z-index:100;}
#menu, #menu ul {padding:0; margin:0; list-style-type: none;}
#menu a, #menu a:visited {margin:auto; display:block;width:195px; font-size:11px; color:#fff; height:25px; line-height:24px; text-decoration:none; text-indent:5px; border:1px solid #000; border-width:1px 0 1px 1px;}
#menu li ul li a, #menu li ul li a:visited {border-width:0 1px 1px 1px;}
#menu li a.link, #menu li a.link:visited {border-width:1px;}
#menu li {float:left; background:#b30000;}
#menu li:hover {position:relative;}
#menu li:hover > a {background:#dfd7ca; color:#c00;}
#menu li ul {display:none;}
#menu li:hover > ul {display:block; position:absolute; top:-11px; left:80px; padding:10px 30px 30px 30px; background:transparent; width:120px;}
#menu > li:hover > ul {left:-30px; top:16px;}
#menu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:1em;}
* html #menu li a:hover {position:relative; background:#dfd7ca; color:#c00;}
#menu li a:active, #menu li a:focus {background:#dfd7ca; color:#c00;}
#menu li.link_strzalka_bok {background:#7484ad url(http://blog.piotrnalepa.pl/demo/menu/strzalka_bok.gif) no-repeat right center;}
#menu li.link_strzalka_dol {background:#7484ad url(http://blog.piotrnalepa.pl/demo/menu/strzalka_dol.gif) no-repeat right center;}
* html #menu li ul {visibility:hidden; display:block; position:absolute; top:-11px; left:80px; padding:10px 30px 30px 30px; background:transparent;}
#menu li a:hover ul ul{visibility:hidden;}
#menu li a:hover ul a:hover ul ul{visibility:hidden;}
#menu li a:hover ul a:hover ul a:hover ul ul{visibility:hidden;}
#menu li a:hover ul a:hover ul a:hover ul a:hover ul ul {visibility:hidden;}
#menu li a:hover ul {visibility:visible; left:-30px; top:14px;}
#menu li a:hover ul a:hover ul{visibility:visible; top:-11px; left:80px;}
#menu li a:hover ul a:hover ul a:hover ul {visibility:visible;}
#menu li a:hover ul a:hover ul a:hover ul a:hover ul {visibility:visible;}
#menu li a:hover ul a:hover ul a:hover ul a:hover ul a:hover ul {visibility:visible;}
background-color: #FFFFFF; /* kolor strony */
font-family: Verdana, Sans-serif; /* krój czcionki */
font-size: 15px; /* rozmiar czcionki */
display: inline;
width:800px;
text-align: center;}
#logo
{
position:relative;
margin:auto; height:400; text-align: center; width:800px; background-image:url(images/logo.jpg)}
#menu_zawartosc {margin:auto; position:relative; width:800px; height:25px; z-index:100;}
#menu, #menu ul {padding:0; margin:0; list-style-type: none;}
#menu a, #menu a:visited {margin:auto; display:block;width:195px; font-size:11px; color:#fff; height:25px; line-height:24px; text-decoration:none; text-indent:5px; border:1px solid #000; border-width:1px 0 1px 1px;}
#menu li ul li a, #menu li ul li a:visited {border-width:0 1px 1px 1px;}
#menu li a.link, #menu li a.link:visited {border-width:1px;}
#menu li {float:left; background:#b30000;}
#menu li:hover {position:relative;}
#menu li:hover > a {background:#dfd7ca; color:#c00;}
#menu li ul {display:none;}
#menu li:hover > ul {display:block; position:absolute; top:-11px; left:80px; padding:10px 30px 30px 30px; background:transparent; width:120px;}
#menu > li:hover > ul {left:-30px; top:16px;}
#menu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:1em;}
* html #menu li a:hover {position:relative; background:#dfd7ca; color:#c00;}
#menu li a:active, #menu li a:focus {background:#dfd7ca; color:#c00;}
#menu li.link_strzalka_bok {background:#7484ad url(http://blog.piotrnalepa.pl/demo/menu/strzalka_bok.gif) no-repeat right center;}
#menu li.link_strzalka_dol {background:#7484ad url(http://blog.piotrnalepa.pl/demo/menu/strzalka_dol.gif) no-repeat right center;}
* html #menu li ul {visibility:hidden; display:block; position:absolute; top:-11px; left:80px; padding:10px 30px 30px 30px; background:transparent;}
#menu li a:hover ul ul{visibility:hidden;}
#menu li a:hover ul a:hover ul ul{visibility:hidden;}
#menu li a:hover ul a:hover ul a:hover ul ul{visibility:hidden;}
#menu li a:hover ul a:hover ul a:hover ul a:hover ul ul {visibility:hidden;}
#menu li a:hover ul {visibility:visible; left:-30px; top:14px;}
#menu li a:hover ul a:hover ul{visibility:visible; top:-11px; left:80px;}
#menu li a:hover ul a:hover ul a:hover ul {visibility:visible;}
#menu li a:hover ul a:hover ul a:hover ul a:hover ul {visibility:visible;}
#menu li a:hover ul a:hover ul a:hover ul a:hover ul a:hover ul {visibility:visible;}
a tu ss z problemem:
Uploaded with ImageShack.us
@EDIT
Udało mi się zmiescić menu o pełnym wymiarze w 1 linijce!!! Jestem super zadowolony ;o
Teraz jeszcze rozciagniecie w dol pola loga tak aby mialo 400. noi te treści na dole ale to jak sie z tym uporam.
Czy mogę zrobić tak aby logo przylegało bezpośrednio do menu tak zeby nie bylo tej przerwy? ;>
Pozdrawiam