Forum PHP.pl > [HTML][CSS]CSS obnizenie strony.

bigshow

4.11.2010, 14:49:14

Siema. Mam problem z 1 strona. Jak na swój wiek myślę ze nie jestem najgorszy w te klocki. A na temat problemy szablon mam z takiej 1 strony zanim wstawiłem to na hosting wszystko ale na hostingu jest reklama i stronę wygląda tak http://bigshow.cba.pl/. A chciałem obniżyć cała stronę zęby reklama była gdzie tam w górze a ten czerwony baner na napisie tu jest, jak to jest napisane w CSS i HTML.
To jest CSS

Kod

body {
#center {
position: absolute;
left:50%;
margin-left: -450px;
top:0px;
width:900px;
}
  top: 100px;
  vertical-align: -15px;
  margin: 0 auto;
  font-family: "trebuchet ms", "verdana";
  font-size: 15px;
  color: #000;
  width:800px;
  background:#fff url(tlo.jpg) repeat-x;
}
a {
  text-decoration: none;
  color:#D13C64
}

img {border:0px}

#head {
       color:white;
       height:130px;
       padding:0;
       margin:0;
}

#head h1 {
          padding:15px 0 0 0px;
          margin:27px 0 0 0;
          font-size:30px}
#head h2 {
            font-size:15px;
            margin:0;
            padding:0}

#menu {
        list-style: none;
        margin: 0;
        padding: 4px 2px;
        float:right
}
#menu li {
        float: left;
        margin: 0 2px;
        border: 1px solid white;
        background:#BC2A6C url(tlon.jpg);
        height:35px;
}
#menu a {
        display: block;
        padding: 12px;
        color: #fff;
        font-size: 11px;
        text-decoration: none;
        line-height: 100%;
}
#menu a:hover, #menu a:active {
        background:#6B0B36;
        color: #FFF000;
}

#l_menu {float: left;
        padding: 0;
        margin-bottom: 1px;
        color: #A7103D;
        background:white;
        width:180px;}

#l_menu ul {list-style: none;
            margin: 0;
            padding: 0;
            border: none;
            font-size:11px}

#l_menu li {border-bottom: 1px solid #920D32;
            margin: 0;    }

#l_menu li a {display: block;
             padding: 10px 10px 5px 25px;
             font-weight : normal;
             color: #920D32;
             text-decoration: none;}

#l_menu li a:hover {border-right: 5px solid #3D021C;
                    border-left: 5px solid #3D021C;
                    color: #fff;
                    font-weight:bold;
                    background:#920D32}

#l_menu h1 {font-size:12px;
            text-align:center;
            margin:0;
            padding:2px;
            background:#9F0F39;
            border-top:5px solid #BA2A6A;
            color:white
            }

#content {background:#ffffff;
          color:#6C0734;
          padding:10px;
          font-size:12px;
          text-align:justify;
          margin:0 0px 0 190px;
          }

#foot {
          clear: both;
          text-align:right;
          background: #880C2D;
          padding: 10px;
          margin: 10px 0 2px 0;
          border:1px solid white;
          color:#fff;
          font-size:9px
}

A to html

Kod

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>BigShoW</title>
    <meta http-equiv="Content-Type" content="text/html; charset=Cp1250">
    <link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body><script type="text/javascript" src="http://a.cba.pl/r1.js"></script>

<div id="head">
    <h1>BigShoW</h1>

    <h2>Żyj z pasj± i kochaj z pasj±...</h2>


    <ul id="menu">
        <li><a href="index.html">Strona główna</a></li>
        <li><a href="kontakt.html">Kontakt</a></li>
        <li><a href="konkurs.html">Konkurs</a></li>
        <li><a href="video.html">Video</a></li>

        <li><a href="forum.html"><b>Forum</b></a></li>
    </ul>
</div>

    <div id="l_menu">
        <ul>
            <li><h1>Menu </h1></li>
            <li> <a href="index.html"> Strona główna </a></li>
            <li> <a href="kontakt.html"> Kontakt </a></li>
            <li> <a href="Konkurs.html"> Konkurs</a></li>

            <li> <a href="video.html"> Video</a></li>
            <li> <a href="forum.html"> Forum </a></li>
            <li> <a href="ankieta.html"> Ankieta</a></li>
            <li> <a href="komentarze.html"> Komentarze</a></li>

        </ul>
    </div>



<div id="content">
Ine in tonni hagen adusinyo, feyo siui dite izo hu. Iko aruka xinte kodanyo mi, asina umidi amadaci ta sir, ire keni hala fenko du. In kun itani peceko, cai gula sucan ta, juda anice ura je. Vi nili husu apona cai. Ipe siui itoni tu, ino hu pari isuje sangenci. Du huro udara itani zin. Vi supa vema iso, dure kodak jereni zi jio, zn kun poli zumeni pontane.<br/><br/>

Iso du keni agona fonograf, on ade game imagi, tolen sucon aci ta. Lasin kenda suhum pe puo, sir du gona sigaret. Hin siui jenmo ni, abeyo karune sigaret iro zi. Pe iku ubeni iraxin. Bar ta zofi ubeni, ire umma cigi tenka te. Vi amubi jakine ani, lakana isidio zumeni si ipa. Rici umiga mandi hu ubo, ire te ruba ninna ubeni.<br/><br/>

Je sen cebi unuda pazocan. Xau ne itone urekada, ena kayo decen in. Nuru agaden zin je, pari udeba perinda tan ma. Upeda busana rubada zi ino. Ire pana umiga tolen ma.<br/><br/>

Zin in zate senga, mi sin cina gula. Husu dalen xinte ani mi, te para vema men, abu tana denda di. On line agama fonograf ire, kin kidon adusinyo zu. In aga umiga lindi atasada, lindi rici universita co vin. Don hu suko akama ikuxin, si irida purojen sen.Di gona adeya azucio kin. Kuce tenka ceika tan tu, ire pila decen igoyo ri. Zina indan ire di. Ma ena zote umidi agaden. Ta aga caya nedini, tana unadi paimoda ite te, noci ugoba jakine du ine. Mi nili ayaka busana ika, aruka meseda agaden vin co.Tan tu indan ninna. Du kidon igoyo kodanyo ade, ma unya undan upeda don. Indan runbi sogane din pe, fada isavi bia zi, zn indan utimen sen. Zu supa akama aga. Kin mate gona umidi pe, te nili kayo hin.<br/><br/>

Hu ila melangi itisini atarenda. Vi bero jaben sin. Ume fada ugoba isidio ri, geru imagi vanyo ri kin. Bar keya hegio pe. Zi pin unya cina, iseda adani isuje zn don, hala aguni ugevio puo zi.<br/><br/>

Cina ille uzoni ena ta, bero rici je izo, hu unama anala dun. Ena pila poli agama in, pe ine boro denda adusinyo, ille cena hu uga. Ire suzo melangi paimoda si, te cebi lana imi. Uci huro dilakada on. Hagen vedaya atarenda zi ite, ni juda aguni hun. Cagun ugevio di ila, hin zi zali gelen.
</div>

<div id="foot">Copyright by BigShoW.cba.pl | Szablon wykonała <a href="http://szabloniki.com" title="szablony">Sliffka</a> | Strone zrobił Suchy</div>

<script type="text/javascript"></script><div style="text-align:center;font-size:11px" class="cbalink"><a href="http://www.cba.pl/" title="darmowy hosting">Darmowy Hosting</a> CBA.PL<br/><br/></div>
<script type="text/javascript" src="http://a.cba.pl/r2.js"></script>

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
_uacct = "UA-2289508-3";
urchinTracker();
</script>
</body>
</html>

Tej reklamy nie da się w żaden sposób usunąć.
Z Góry dzięki za pomoc.

cniak

4.11.2010, 14:54:35

najprosciej bylo by gdybys dal wiekszy padding od gory i poprostu dal do kazdego odnosnika dodatkowo #content, na przyklad kontakt.html#content

bigshow

4.11.2010, 15:00:11

A napisał być dokładnie co i gdzie jak mówiłem na swój wiek jestem dobry ale mam 12 lat. I CSS dopiero zaczynam do tej pory uczyłem się HTML>

Damonsson

4.11.2010, 16:16:58

#head {
color:white;
height:130px;
padding:0;
margin:0;
}

Nie baner jest na napisie, tylko kolor napisu jest biały. Białe litery, na białym tle \o/

bigshow

4.11.2010, 16:21:20

Napis ma być biały wklej se to an napisałem an nataki i zapisz dobrze to będzie wszystko git tylko te reklamywszystko psuja i chciałem to przesunąć, a to co napisałeś zaraz sprawdzę.

Damonsson

4.11.2010, 16:25:07

To ja czegoś nie rozumiem... W czym problem?
Tylko napisz spokojnie i przeczytaj to co napisałeś i czy można to zrozumieć.

Nic nie sprawdzisz, bo to Twój kod

edit:
Co to?

[CSS] pobierz, plaintext 
body {
#center {
position: absolute;
left:50%;
margin-left: -450px;
top:0px;
width:900px;
}
  top: 100px; 
  vertical-align: -15px;
  margin: 0 auto;
  font-family: "trebuchet ms", "verdana";
  font-size: 15px;
  color: #000;
  width:800px;
  background:#fff url(tlo.jpg) repeat-x;
}
[CSS] pobierz, plaintext

CSS4?

bigshow

4.11.2010, 16:43:30

Chodzi mi oto ze ten szablon pobrałem i nie jestem aż tak dobry w CSS, a na moim hostingu CBA.pl (nie znam innego) wyskakuje reklama i nie widać napisu "BigShoW", który normalnie jest na tym czerwonym tle. i chce to czerwone trochę obniżyć zęby to nachodziło na ciebie tak jak jest zanim to wstawię na serwer.
Teraz łapiesz o co mi chodzi ?

Tu jest link do szablony który kupiłem zwróć uwagę na ten biały napis na czerwonym tle ja chce co takiego uzyskać.
http://szabloniki.com/www/clean/index.html

Damonsson

4.11.2010, 16:46:15

[CSS] pobierz, plaintext 
#content1 { top: 100px; 
  vertical-align: -15px;
  margin: 0 auto;
  font-family: "trebuchet ms", "verdana";
  font-size: 15px;
  color: #000;
  width:800px;
}
#headd {
  color: #000;
  background:#fff url(http://bigshow.cba.pl/tlo.jpg) repeat-x;
}
[CSS] pobierz, plaintext

[HTML] pobierz, plaintext 
<body><!--]>--><script type="text/javascript" src="http://a.cba.pl/r1.js"></script>
 
<div id="headd">
    <h1>BigShoW</h1>
 
    <h2>Żyj z pasj? i kochaj z pasj?...</h2>
  </div>  
    <div id="content1">
    <div id="head">
    <ul id="menu">
 
 
(...)
 
 
 
<div id="foot">Copyright by BigShoW.cba.pl | Szablon wykonała <a href="http://szabloniki.com" title="szablony">Sliffka</a> | Strone zrobił Suchy</div>
</div>
<script type="text/javascript"></script><div style="text-align:center;font-size:11px" class="cbalink"><a href="http://www.cba.pl/" title="darmowy hosting">Darmowy Hosting</a> CBA.PL<br/><br/></div>
<!--]>--><script type="text/javascript" src="http://a.cba.pl/r2.js"></script>
 
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
_uacct = "UA-2289508-3";
urchinTracker();
</script>
</body>
[HTML] pobierz, plaintext

Podmień to co Ty masz, na to co ja Ci tu wyżej napisałem.

Tak na szybko zrobiłem, o to chodzi?

To wywal całkowicie:

[CSS] pobierz, plaintext 
body {
#center {
position: absolute;
left:50%;
margin-left: -450px;
top:0px;
width:900px;
}
  top: 100px; 
  vertical-align: -15px;
  margin: 0 auto;
  font-family: "trebuchet ms", "verdana";
  font-size: 15px;
  color: #000;
  width:800px;
  background:#fff url(tlo.jpg) repeat-x;
}
[CSS] pobierz, plaintext

b4rt3kk

4.11.2010, 16:54:19

[HTML] pobierz, plaintext 
#head {
       color:white;
       height:130px;
       padding:0;
       margin:0;
}
[HTML] pobierz, plaintext

Zmień wartość height:130px; na inną, nieco większą, może 200px, nie wiem kombinuj.

[HTML] pobierz, plaintext 
#head h1 {
          padding:15px 0 0 0px;
          margin:27px 0 0 0;
          font-size:30px}
#head h2 {
            font-size:15px;
            margin:0;
            padding:0}
[HTML] pobierz, plaintext

Pobaw się marginesami górnymi tak by tekst znajdował się w miejscu, w którym Ci odpowiada. Najprościej dodać margin-top: xxpx; W miejsce xx wstaw wartość w pikselach, tak by tekst nie znajdował się pod reklamą.

bigshow

4.11.2010, 18:38:15

Jeszcze jedna rzecz i będzie pięknie. Zobaczenie na stronę (http://bigshow.cba.pl/) i brakuje mi do zrobienie odstęp co typy <br> ale w CSS miedzy tym czerwonym paskiem a MENU i zęby ten czerwony pasek był na całą szerokość strony. Ja coś spróbuje znaleźć ale niewydajne mi się żeby mi się udało znaleźć.

cniak

4.11.2010, 20:05:43

masz tak:

[HTML] pobierz, plaintext 
body {
width:900px;
 
}
[HTML] pobierz, plaintext

ustaw na width: 100%; a dla reszty divów zrob poprostu po 900 px lub stworz jakiegos diva, ktory bedzie odrazu po divie head do konca strony (stopki tez) i nadaj mu width: 900 px;

P.S To drugie rozwiazanie jest zgodne ze standardami

bigshow

4.11.2010, 22:05:48

Nie wiem czy to dobrze zrobiłem z tym czerwonym i wyszło ale ten odstęp czerwonego od menu mi nie wychodzi, i to pod tym czerwonym jest ten 100% a tego nie chciałem . Mam do was wielka prośbę jeśli więcej o co mi chodzi przeróbcie mi ten arkusz CSS zęby był taki o jaki pisze ciągle. ( Część HTML nie zmieniałem ).

Kod

body

      #content1 { top: 100px;

      vertical-align: -15px;

      margin: 0 auto;

      font-family: "trebuchet ms", "verdana";

      font-size: 15px;

      color: #000;

      width:100%;

      }

      #head {

      color: #000;

      background:#fff url(http://bigshow.cba.pl/tlo.jpg) repeat-x;

      }
a {
  text-decoration: none;
  color:#D13C64
}

img {border:0px}

#head {
       color:white;
       height:130px;
       padding:0;
       margin:0;
}

#head h1 {
          padding:15px 0 0 0px;
          margin:27px 0 0 0;
          font-size:30px}
#head h2 {
            font-size:15px;
            margin:0;
            padding:0}

#menu {
        list-style: none;
        margin: 0;
        padding: 4px 2px;
        float:right
}
#menu li {
        float: left;
        margin: 0 2px;
        border: 1px solid white;
        background:#BC2A6C url(tlon.jpg);
        height:35px;
}
#menu a {
        display: block;
        padding: 12px;
        color: #fff;
        font-size: 11px;
        text-decoration: none;
        line-height: 100%;
}
#menu a:hover, #menu a:active {
        background:#6B0B36;
        color: #FFF000;
}

#l_menu {float: left;
        padding: 0;
        margin-bottom: 1px;
        color: #A7103D;
        background:white;
        width:180px;}

#l_menu ul {list-style: none;
            margin: 0;
            padding:;
            border: none;
            font-size:11px}

#l_menu li {border-bottom: 1px solid #920D32;
            margin: 0;    }

#l_menu li a {display: block;
             padding: 10px 10px 5px 25px;
             font-weight : normal;
             color: #920D32;
             text-decoration: none;}

#l_menu li a:hover {border-right: 5px solid #3D021C;
                    border-left: 5px solid #3D021C;
                    color: #fff;
                    font-weight:bold;
                    background:#920D32}

#l_menu h1 {font-size:12px;
            text-align:center;
            margin:0;
            padding:2px;
            background:#9F0F39;
            border-top:5px solid #BA2A6A;
            color:white
            }

#content {background:#ffffff;
          color:#6C0734;
          padding:10px;
          font-size:12px;
          text-align:justify;
          margin:0 0px 0 190px;
          }

#foot {
          clear: both;
          text-align:right;
          background: #880C2D;
          padding: 10px;
          margin: 10px 0 2px 0;
          border:1px solid white;
          color:#fff;
          font-size:9px
}

Z góry dzięki http://bigshow.cba.pl/.