Jak "podnieść pasek menu" i jak "zrobić elastyczne tło"?

Post28 kwie 2010, 19:21

problem jest następujący.. jak poniżej,.. szukałem w CSS ale nie mogę znaleźć bo to zapewne tam trzeba zmienić parametry. Wiecie gdzie bo ja już nie wiem,..

W Microsoft Office Share Point Designer jest normalnie strona.. a gdy wezmę podgląd w Firefoxie są takie błędy( tyczy się tylko tego tła że się nie chce rozciągnąć) a menu nawet w programie jest źle widoczne:

problem:
1. Dostępne tylko dla zarejestrowanych użytkowników

2. Dostępne tylko dla zarejestrowanych użytkowników

z góty thx

Post28 kwie 2010, 21:38

Możesz powiedzieć skąd My mamy wiedzieć co w trawie piszczy? Daj kod strony + plik styles.css to zobaczymy co jest nie tak.

Post28 kwie 2010, 23:28

CSS

Kod: Zaznacz cały

* {
    margin: 0;
    padding: 0;
}

body {
    padding: 0;
    font: 13px/21px "Trebuchet MS", Arial, Helvetica, sans-serif;
    text-align: center;
    color: #6D6D6D;
    background:url(images/zielone.jpg);
}

h1 {
    padding: 10px 0 0 0;
    font-weight: bold;
    font-size: 36px;
    line-height: 48px;
    text-align: center;
    text-transform: lowercase;
    color: White;
}

h1 a {
    font-weight: bold;
    text-decoration: none;
    color: White;
}

h1 a:hover {
    color: White;
}

p {
    padding: 8px 0;
    text-align: justify;
}

a {
    text-decoration: underline;
    color: #FA791F;
    outline: none;
}

a:hover {
    text-decoration: none;
    color: #FA791F;
}

#main {
    margin: 0 auto;
    width: 816px;
    background: #FAFAF8;
}

#main2 {
    margin: 0 auto;
    width: 800px;
    text-align: left;
}

#menu {
    padding: 0 0 8px 0;
    height: 20px;
}

#menu ul {
    list-style: none;
}

#menu ul li {
    float: left;
    display: block;
    width: 160px;
    height: 40px;
}

#menu ul li a {
    display: block;
    padding: 0 0 0 12px;
    font-weight: bold;
    font-size: 15px;
    line-height: 40px;
    text-decoration: none;
    color: #65A7CA;
    background: url(images/menu.gif) repeat-x;
    border-right: 1px solid #DCDCCC;
}

#menu ul li.lastmenu a {
    border: none;
}

#menu ul li a:hover {
    text-decoration: none;
    color: #FA791F;
}

#menu ul li a.active {
    text-decoration: none;
    color: #FA791F;
}

#header {
    height: 280px;
    background: url(images/top good.jpg)
}

#middle {
    margin-top: 80px;
    padding: 12px 12px 0 12px;
    height: 1%;
    background: url(images/middle.gif) repeat-x top;
}

#left {
    float: left;
    width: 530px;
}

#left h3 {
    margin: 20px 0 5px 0;
    padding: 0 0 0 18px;
    font-size: 23px;
    line-height: 30px;
    text-transform: lowercase;
    color: #147E9D;
    background: url(images/lefth3.gif) no-repeat left;
}

#left ul {
    padding: 8px 0 8px 40px;
}

#left ul li {
    padding: 0;
    text-align: justify;
}

#search {
    width: 300px;
    height: 50px;
}

#search form {
}

#search input.text {
    float: left;
    display: block;
    padding: 3px;
    width: 220px;
    font-size: 15px;
    color: #6C6C6C;
    background: White;
    border: 1px solid #D1D1BB;
    border-bottom: 1px solid #DBDBCB;
    border-top: 1px solid #C9C9B0;
}

#search input.submit {
    float: right;
    display: block;
    padding: 4px 0;
    width: 67px;
    font-weight: bold;
    font-size: 11px;
    color: White;
    background: #FF6E13 url(images/search.gif) repeat-x;
    border: 1px solid #D1D1BB;
    border-bottom: 1px solid #DBDBCB;
    border-top: 1px solid #C9C9B0;
}

#sidebar {
    float: right;
    width: 222px;
}

.box {
    margin-bottom: 15px;
    padding: 6px 0;
    width: 220px;
    background: White url(images/box.jpg) no-repeat bottom;
    border: 1px solid #F3F3F3;
}

#sidebar h3 {
    font-size: 15px;
    line-height: 30px;
    text-align: center;
    text-transform: lowercase;
    color: #144855;
    background: url(images/sidebarh3.gif) no-repeat top;
}

#sidebar ul {
    list-style: none;
    padding: 5px 15px 16px 15px;
}

#sidebar ul li {
    padding: 0 5px 0 15px;
    line-height: 28px;
    border-bottom: 1px solid #EEF5F8;
}

#sidebar ul li a {
    padding: 0;
    text-decoration: none;
    color: #147E9D;
}

#sidebar ul li a:hover {
    text-decoration: none;
    color: #FA791F;
}

.clearing {
    clear: both;
    height: 5px;
    overflow: hidden;
}

#footer {
    clear: both;
    padding-bottom: 5px;
    height:66px;
    background: url(images/mały pasek pod napisy.jpg) repeat-x top;
}

#footer p {
    padding: 12px;
    font-size: 12px;
    color: #444;
}

Strona

Kod: Zaznacz cały

<!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>
    <title>Prawosławna Parafia w Siemiatyczach</title>
    <meta name="keywords" content="prawosławie, cerkiew, siemiatycze, parafia, zmartwychwstanie, pańskie" />
    <meta name="description" content="Prawosławna Parafia p/w Zmartwychwstania Panskiegow Siemiatyczach" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
    <meta http-equiv="Content-Language" content="pl" />
    <meta name="language" content="en" />
    <link href="style.css" rel="stylesheet" type="text/css" media="screen" />
   <style type="text/css">
.style1 {
   text-align: center;
   
}
.style2 {
   font-size: 16pt;
}
.style3 {
   font-weight: normal;
   font-size: small;
   color: #FF0000;
}
.style5 {
   vertical-align: center;
}
.style7 {
   color: #147E9D;
}
.style8 {
   font-family: "Times New Roman";
   color: #008000;
}
.style9 {
   vertical-align: center;
   font-family: "Times New Roman";
}
.style12 {
   text-align: left;
   font-family: "Times New Roman";
}
.style13 {
   font-size: small;
   color: #FF0000;
   font-family: "Trebuchet MS";
}
.style14 {
   color: #008000;
   text-decoration: none;
}
.style15 {
   color: #008000;
   vertical-align: text-bottom;
}
.style16 {
   text-align: center;
   margin-bottom: 0;
}
.style17 {
   border: 1px solid #800080;
   background-color: #FBF284;
}
.style18 {
   text-align: center;
   vertical-align: center;
   font-size: 14pt;
   margin-top: 0;
}
.style19 {
   color: #008000;
}
</style>
   </head>

<body>
   <br/>
   
  
    <div id="main" style="height: 1600px">
        <div id="main2">
            
            <div id="header">
                    
                     <img alt="top" src="../Strona%20Prawosławnej%20Parafii%20pw%20Zmartwychwstania%20Pańskiego/images/top%20good.jpg" width="800" height="280" /></div>
            
            <div id="menu">
                <ul>
                    <li class="style1">
               <a class="active" href="#" style="color: #008000">Historia</a></li>
                    <li class="style1"><a href="#" style="color:blue">Galeria</a></li>
                    <li class="style1"><a href="#" style="color:blue">
               Aktualności</a></li>
                    <li class="style1"><a href="#" style="color:blue">Kontakt</a></li>
                    <li class="style1"><a href="#" style="color:blue"class="style2">
               Forum</a></li>
                </ul>
            </div>
            
            <div id="middle">
                <div id="left">
                    <div id="search">
                        <form method="get" action="#" accept-charset="utf-8">
                            <input type="text" class="text" />
                            <input type="submit" class="submit" value="Szukaj" />
                        </form>
                    </div>
                    <h3>&nbsp;
                   <a href="index.html">Nasza Cerkiew</a>
</h3>
                    <p>tekst</p>
                    <h3>&nbsp;<a href="index.html">Nasza Cerkiew</a>
</h3>
                    <p>tekstfsdfsdfsdf afsdsfsdfcdzczcczxcxz</p>
                    <ul>
                        <li>wypunktowanie</li>
                                          </ul>
                    <p>tekst</p>
                    <h3>&nbsp;<a href="index.html">Nasza Cerkiew</a>
</h3>
                    <p>tekst</p>
                    <h3>&nbsp;<a href="index.html">Nasza Cerkiew</a>
</h3>
                    <p>tekst</p>
                    <ul>
                        <li>wypunktowanie</li>
                                           </ul>
                    <p>tekst</p>
                    <h3>&nbsp;<a href="index.html">Nasza Cerkiew</a>
</h3>
                    <p>tekst</p>
                </div>
                <div id="sidebar">
                    <div class="box">
                        <h3 style="height: 32px" class="style12">
                  <span class="style15">galeria</span> <sup><span class="style13">
                  &nbsp;Nowe</span></sup></h3>
                        <ul>
                            <li class="style7"><a href="index.html">Nasza 
                     Cerkiew</a></li>
                            <li class="style7"><a href="#">1</a>. </li>
                            <li class="style7"><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li class="style7">6</li>
                            <li class="style7"><a href="#">7</a></li>
                        </ul>
                    </div>
                    <div class="box">
                        <h3 style="height: 36px"><span class="style5">
                  <span class="style8">Aktualności</span> </span>&nbsp;<sup><span class="style3"><strong>nowe</strong></span></sup></h3>
                        <ul>
                            <li class="style7"><a href="#">1</a></li>
                            <li class="style7"><a href="#">2</a></li>
                            <li class="style7"><a href="#">3</a></li>
                            <li class="style7"><a href="#">4</a></li>
                            <li class="style7"><a href="#">5</a></li>
                            <li class="style7"><a href="#">6</a></li>
                     <li class="style7"><a href="#">7</a></li>
                        </ul>
                    </div>
               <div class="box">
                  <h3 style="height: 34px"><span class="style9">
                  <a href="www.forum-Bractwa.pl" class="style14">wątki na 
                  forum</a>
                  </span>&nbsp;<sup><span class="style3"><strong>nowe</strong></span></sup></h3>
                  <ul>
                     <li class="style7"><a href="#">1</a></li>
                     <li class="style7"><a href="#">2</a></li>
                     <li class="style7"><a href="#">3</a></li>
                     <li class="style7"><a href="#">4</a></li>
                     <li class="style7"><a href="#">5</a></li>
                     <li class="style7"><a href="#">6</a></li>
                     <li class="style7"><a href="#">7</a></li>
                  </ul>
               </div>
               <div class="box">
                  <h3 style="height: 32px" class="style12">
                  <span class="style15">ciekawe strony</span> <sup><span class="style13">
                  &nbsp;Nowe</span></sup></h3>
                  <ul>
                     <li><a href="www.cerkiew.pl">Cerkiew.pl</a></li>
                     <li class="style7"><a href="#">2</a></li>
                     <li class="style7"><a href="#">3</a></li>
                     <li class="style7"><a href="#">4</a></li>
                     <li class="style7"><a href="#">5</a></li>
                     <li><a href="#">6</a></li>
                     <li class="style7"><a href="#">7</a></li>
                     <li class="style7"><a href="#">8</a><table style="width: 100%">
                        <tr>
                           <td>9</td>
                        </tr>
                     </table>
                     </li>
                  </ul>
               </div>
                </div>
                <div class="clearing" style="height: 73px"> 
               <p style="height: 8px; width: 786px;" class="style16">
               <img alt="pasek żółty" src="pasek%20nad%20nagłówki.jpg" width="586" height="2" /></p>
               <table style="width: 100%" class="style17">
                  <tr>
                     <td style="height: 12px; width: 774px;">
                     <p class="style18" style="height: 30px">
                     <a   <p class="style6">Autor: <a href="http://www.alphastudio.pl" target="_blank">
            Bractwo Młodzieży Prawosławnej z Parafii p/w Zmartwychwstania 
            Pańskiego w Siemiatyczach</a></p>
</a></p></td>
                  
                  </tr>
               </table>
               <table style="width: 100%; height: 1px">
                  <tr>
                     <td>&nbsp;</td>
                  </tr>
               </table>
            </div>
            </div>
                

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

Post29 kwie 2010, 14:35

Co do podniesienia menu, w pliku style.css zmień wartość górnego marginesu i górnego paddingu (chociaż padding możesz zostawić, głównie chodzi o margines) dla id middle:

#middle {
margin-top: 80px;
padding: 12px 12px 0 12px;
height: 1%;
background: url(images/middle.gif) repeat-x top;
}

Zmień pogrubione wartości.

Co do tego tła/dolnej części strony, nie wiem o co chodzi. U mnie wyświetla się normalnie, a po drugie nie mam obrazków, więc dokładnie strony zobaczyć nie mogę.