Forum PHP.pl > [CSS] Połączenie lini w tabelkach

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [CSS] Połączenie lini w tabelkach

Derwisz

26.07.2008, 10:12:47

Witam Wszystkich.
Co należałoby zrobić, żeby się połączyły linie przy lewym marginesie, przy prawym się łączą, a przy lewym nie. Nie moge sobie z tym poradzić? A druga rzecz, jak na tym czarnym pasie tabelki umieścic napis?

Kod

<body>

<div class="pds">
    <div><img src="images/t1.gif" alt="" border="0" usemap="#top"  />
<map name="top" id="top"><area shape="rect" coords="5,25,275,80" href="#photo" alt="" />
<area shape="rect" coords="518,8,599,55" href="#glowna" alt="" />
<area shape="rect" coords="603,9,704,53" href="#mapa" alt="" />
<area shape="rect" coords="714,8,776,53" href="#kontakt" alt="" />
</map></div>
    <div class="t2"><img src="images/t2.jpg" alt="" /></div>
    <div class="m1">
        <div><a href="#">O MNIE</a></div>

    </div>
    <div style="background:url(images/tlo1.gif);">
         <div class="lewe">
            <div class="menu">
                <a href="#">Krajobraz</a>
            </div>
            <p> Można sentencje jakąś włożyć </p>

         </div>
        <div class="prawe">
            <div class="tekst">


---------------------------------------------------------------------------------------------

<div style="background: #000; width: 571px; margin-left: auto; margin-right: auto; padding-top: 40px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; ">


  <div style="background: #161B21; width: 284px; height: 110px; float: left; margin: 0; color: #fff; margin-bottom: 4px;">
  <img src="007.jpg" alt="" style="margin-left: 10px; margin-right: 10px; margin-top: 10px; margin-bottom: 0px; "  /> </div>
  <div style="background: #161B21; width: 284px; height: 110px; float: right; margin: 0; color: #fff; margin-bottom: 4px;"> ....opis</div>





  <div style="background: #161B21; width: 284px; height: 110px; float: left; margin: 0; color: #fff; margin-bottom: 4px;"> </div>
  <div style="background: #161B21; width: 284px; height: 110px; float: right; margin: 0; color: #fff; margin-bottom: 4px;"> </div>





  <div style="background: #161B21; width: 284px; height: 110px; float: left; margin: 0; color: #fff; margin-bottom: 4px;"> </div>
  <div style="background: #161B21; width: 284px; height: 110px; float: right; margin: 0; color: #fff; margin-bottom: 4px;"></div>


<div style="clear: both;"></div>
</div>

--------------------------------------------------------------------------------------------------


            </div>
      </div>

        <div style="clear:both"></div>

    </div>
    <div class="dol"></div>
</div>

</body>
</html>

Pozdrawiam
Derwisz

Sadu2

26.07.2008, 10:14:59

Masakra co to za kod? (czy tylko ja tak źle widze czy pozostali też?)

No najlepiej jak poprawisz, żeby czytelnie tez było.

charlie-cherry

26.07.2008, 18:48:14

Nie mam pojęcia o co ci chodzi. Marginesy i linie w tabelce - u mnie są ok, zarówno pod FF jak i IE.

Jak wstawić tekst w tym czarnym pasie? Jeśli chodzi o tekst w tym górnym (jako nagłówek):

[HTML] pobierz, plaintext 
<div style="background: #000; width: 571px; margin-left: auto; margin-right: auto; padding-top: 40px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; ">
<p style="color:white;">Oto tekst</p>
[HTML] pobierz, plaintext

Derwisz

26.07.2008, 19:24:44

Sorry ja zły kod wkleiłem.
Coś mi to nie idzie - początki zawsze trudne.

Chodzi mi o to żeby to wyglądało jako całość,
Obniżyć i przesunąć w lewo.
http://www.slowikfotogaleria.yoyo.pl/

Kod

<body>

<div class="pds">
    <div><img src="images/t1.gif" alt="" border="0" usemap="#top"  />
<map name="top" id="top"><area shape="rect" coords="5,25,275,80" href="#photo" alt="" />
<area shape="rect" coords="518,8,599,55" href="#glowna" alt="" />
<area shape="rect" coords="603,9,704,53" href="#mapa" alt="" />
<area shape="rect" coords="714,8,776,53" href="#kontakt" alt="" />
</map></div>
    <div class="t2"><img src="images/t2.jpg" alt="" /></div>
    <div class="m1">
        <div><a href="#">O MNIE</a></div>

        <div class="prawe">
            <div class="tekst">


<div style="background: #000; width: 771px; padding-top: 40px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px;">


  <div style="background: #161B21; width: 383px; height: 90px; float: left; margin: 0; color: #fff; margin-bottom: 4px;"> TU WSTAWIAMY FOTOGRAFIE</div>
  <div style="background: #161B21; width: 383px; height: 90px; float: right; margin: 0; color: #fff; margin-bottom: 4px;">A TU OPIS DLA WSTAWIONEJ FOTOGRAFI</div>





  <div style="background: #161B21; width: 383px; height: 90px; float: left; margin: 0; color: #fff; margin-bottom: 4px;"> TU WSTAWIAMY FOTOGRAFIE</div>
  <div style="background: #161B21; width: 383px; height: 90px; float: right; margin: 0; color: #fff; margin-bottom: 4px;">A TU OPIS DLA WSTAWIONEJ FOTOGRAFI</div>





  <div style="background: #161B21; width: 383px; height: 90px; float: left; margin: 0; color: #fff; margin-bottom: 4px;"> TU WSTAWIAMY FOTOGRAFIE</div>
  <div style="background: #161B21; width: 383px; height: 90px; float: right; margin: 0; color: #fff; margin-bottom: 4px;">A TU OPIS DLA WSTAWIONEJ FOTOGRAFI</div>


<div style="clear: both;"></div>
</div>



</div>

</body>
</html>

Inti

26.07.2008, 23:07:41

W tym miejscu:

[HTML] pobierz, plaintext 
...
        <div class="prawe">
            <div class="tekst"> DO CZEGO SA TE 2 DIV'Y NIGDZIE ICH NIE ZAMYKASZ I MOZE TO PSUC UKLAD STRONY
 
BY PRZESUNAC BLOK W DOL OPIS NAPISALEM PONIZEJ, TUTAJ BY NIE BYLO CZARNEGO BLOKU POPROSTU ZMIEN PADDING Z 40PX NA 4PX
<div style="background: #000; width: 771px; padding-top: 4px; padding-bottom: 4px; padding-left: 4px; padding-right: 4px;">
 
...
[HTML] pobierz, plaintext

Jeśli chcesz obniżyć blok, to robisz to na dwa sposoby:
1. wykorzystujesz marginesy (padding służy do dania przerw wewnątrz bloku, tak więc za pomocą padding jego położenia nie ustawisz
2. wykorzsytujesz jeden z selektorów position np:
position:relative; top: 40px - co sprawi, że blok zostanie przesunięty od jego pozycji o 40px od góry (czyli w dół)

Tak w ogóle to jak ta strona została napisana to jest masakra Używaj zewnętrznych stylów css, bowiem jak będziesz miał więcje stron to by coś zmienić w jednej, bedziesz musiał to ręcznie robić w każdej i przeszukiwać kilka dziesiąt linii kodu To że nie wiesz jak korzystać z dziedziczenia i warotści id lub class nie usprawiedliwia - warto się doszkolić Zmiana później to tylko kwestia pliku ze stylami, a nie wszystkich podstron - normalnie mortęga

Dodatkowo to menu górne nie powinno być na mapach Wystarczy pociąć odpowiednio grafikę i ustawić za pomocą właśnie CSS Polecam książkę, "CSS według Erica Meyera"

Pozdrawiam Inti

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.