Pomoc przy szablonie

HTML to podstawy w dziedzinie tworzenia stron WWW, Style CSS warto opanować, bowiem za ich pomocą można dostosować odpowiednio wygląd swojej witryny WWW. Zagłębiamy się dalej i udostępniamy w tym forum możliwość zadawania pytań o JavaScript.
ODPOWIEDZ
fimax
Posty: 1
Rejestracja: śr cze 29, 2011 9:21 am

Pomoc przy szablonie

Post autor: fimax »

Witam wszystkich serdecznie,
Potrzebuję pomocy z kodem HTML oraz CSS.
Potrzebuję dokonać zmian w szablonie tak aby logo było pod innym DIV-em a moduły pod innym. O to zdjęcie aby pokazać o co dokładnie mi chodzi.
http://imageshack.us/f/202/przechwytywaniefy.png/

To jest próby adres do strony: http://mlody-firma.cba.pl/
pod którym można zobaczyć jak obecnie wygląda strona. Po przez firebuga można podglądnąć kod źródłowy strony.

A o to kod strony:
HTML

Kod: Zaznacz cały

<html>
<head>
<title>Strona firmowa www</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<link href="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/css/style.css" rel="stylesheet" type="text/css"/>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />


</head>

<center>
<div id="body">
  <div id="wraper">

	<div id="content">
    <div id="focus">
    <div id="blue"></div>

    <div id="menu">

<jdoc:include type="modules" name="left" style="none" />
     </ul>
    </div>

    <div id="tresc": style="overflow: auto">
<jdoc:include type="component" style="none" />

    </div>
    </div>
 	</div>
<div id="prawycien">
<img src="images/pr.png"/>
</div>
<div id="dolcien">
<img class="lewy" src="images/lewy.png"/>
<img class="prawy" src="images/prawy.png"/>
</div>
</div>
</div>
</center>
</body>
</html>
CSS

Kod: Zaznacz cały

body {background-color: #EAEAEA;
    color: #393939;
    font-family: Tahoma,Gabriola,sans-serif;}
#wraper {    padding-top: 50px;
    width: 1050px;}
#content {    background-color: #FFFFFF;
    float: left;
    height: 800px;
    width: 1010px;}
#prawycien {    background-image: url("../images/bg_r.png");
    background-repeat: repeat-y;
    float: left;
    height: 800px;
    width: 25px;}
#dolcien {    background-image: url("../images/bg_dc.png");
    background-repeat: repeat-x;
    float: left;
    height: 30px;
    width: 1035px;}
#dolcien .lewy {float:right;}
     
#dolcien .prawy {float:left;}
    
#focus {    background-color: #DCDCDC;
  background-image: url("../images/logo.png");
    background-repeat: no-repeat;
    background-position: top left;
    height: 780px;
    margin-top: 10px;
    width: 995px}


#blue {background-color: #0d85ff;height: 220px;
    margin-left: 255px;border-left: 2px solid #A9A9A9;}


#menu li {text-decoration: none}
#menu li{float:right; text-align:center; display:block; height:60px; width:123px; background:url(../images/przycisk.png) bottom left no-repeat; background-position:0px 0px; text-decoration: none;}
#menu li a{margin:0px; padding:0px; display:block; padding-top:25px; text-decoration: none;}
#menu li:hover{background:url(../images/przycisk.png) bottom left no-repeat; background-position:0px -60px; color:#ffffff; text-decoration:none;}
#menu li:hover a{color:#ffffff; text-decoration:none;}
#menu {margin-left: 255px;height: 60px;background-color: #ffffff;border-left: 2px solid #A9A9A9; text-decoration: none;}
#menu ul{list-style-type: none;
text-decoration: none;
    margin: 0;
    padding: 0;
    }
#tresc {    background-color: #FFFFFF;
    border-left: 1px solid #A9A9A9;
    float: left;
    height: auto !important;
    min-height: 480px;
    margin-left: 255px;
    width: 738px;
    overflow: auto;
}
Byłbym wdzięczny o prawienie tego kodu.
Pozdrawiam serdecznie i dziękuję za pomoc z góry.
ODPOWIEDZ