Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> Odstępy między Divami
sajmex
post
Post #1





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 18.02.2008

Ostrzeżenie: (0%)
-----

Witam!
Mam mały kłopot. Składam stronkę i w boxach na dole pojawiły się odstępy. Już nie mam pomysłów co z tym zrobić, od 2 dni siedzę nad tym, bez pożądanych efektów. W IE o dziwo jest ok, natomiast w FF i Operze niestety nie. Bardzo prosiłbym o pomoc. Może ktoś spojrzy świeżym okiem i od razu dostrzeże głupi błąd smile.gif. Z góry bardzo dziękuję.

Adres do stronki: http://grajnd.ovh.org/auto-rss

Kod XHTML
Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
<title>Auto-RSS.pl - najświeższe wiadomości motoryzacyjne</title>
  <META http-equiv=Content-Type content="text/html; charset=_autodetect_all">
    <meta name="Description" content="Auto-RSS.pl" />
<link rel="stylesheet" href="styl.css" type="text/css" />
</head>
<body>
<div id="calosc">
    <div id="logo">
        <img src="pliki/logo_01.png"><img src="pliki/logo_02.png">
    </div>
        <div id="menu">
            <img src="pliki/menu_01.png"><img src="pliki/menu_02.png"><img src="pliki/menu_03.png"><img src="pliki/menu_04.png"><img src="pliki/menu_05.png"><img src="pliki/menu_06.png"><img src="pliki/menu_07.png"><img src="pliki/menu_08.png"><img src="pliki/menu_09.png"><img src="pliki/menu_010.png"><img src="pliki/menu_011.png">
        </div>
    <div id="top"><img src="pliki/gora_01.png"></div>
    <div id="news"><img src="pliki/news_01.png"><span id="tekst">Tutaj wstaw sobie "Najświeższe wiadomości"...</span></div>
    <div id="test"><img src="pliki/news_02.png"><span id="tekst">Tutaj wstaw sobie "Testy i porównania"...</span></div>
    <div id="test_bok"><img src="pliki/news_03.png"></div>
    <div id="dol"><img src="pliki/gora_03.png"><img src="pliki/bottom_01.png"></div>
<div id="lewa">
    <div id="ciekawostki"><img src="pliki/ciekaw_01.png"><span id="tekst">Ciekawostki tutaj będą :)</span></div><div><img src="pliki/ciekaw_02.png"></div>
    <div><img src="pliki/naglowek.png"></div>
    <div id="ciekawostki"><img src="pliki/ciekaw_01.png"><span id="tekst">Coś tutaj będzie :)</span></div>
    <div><img src="pliki/ciekaw_02.png"></div>
</div>
<div id="srodek">
    <div id="oglosz"><img src="pliki/oglosz_01.png"><span id="tekst">I tutaj też!</span></div>
    <div><img src="pliki/oglosz_02.png"></div>
</div>
<div id="prawa">
    <div id="foto"><img src="pliki/foto_01.png"><span id="tekst">No tu też nie może zabraknąć tekstu!</span></div>
    <div><img src="pliki/foto_02.png"></div>
    <div><img src="pliki/reklama.png"></div>
    <div id="foto"><img src="pliki/foto_01.png"><span id="tekst">Zapraszamy na reklamy</span></div>
    <div><img src="pliki/foto_02.png">
</div>
</div>
</div>
<div>
<img src="pliki/stopka_01.png"><img src="pliki/stopka_02.png"><img src="pliki/stopka_03.png"><img src="pliki/stopka_04.png"><img src="pliki/stopka_05.png"><img src="pliki/stopka_06.png"><img src="pliki/stopka_07.png"><img src="pliki/stopka_08.png"><img src="pliki/stopka_09.png"><img src="pliki/stopka_010.png">
</div>
</div>
</body>
</html>


KOD CSS:

Kod
body {
    background-color: #f2f2f2;
    font-family: Tahoma;
    font-size: 12px;
    color: white;
    margin-top: 0;
    margin-left: 0;
}

img {
    margin-bottom: 0;
    margin-top: 0;
}

#tekst {
    width: 300px;
    height:300px;
    vertical-align: top;
}

#calosc {
    width: 1000px;
    height: 928px;
    margin: auto;
}

#logo {
    width: 100%;
    height: 118px;
    background-image: url('pliki/logo_03.png');
    background-repeat: no-repeat;
    background-position: right;
}

#menu {
    width: 100%;
    height: 35px;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    border: none;
}

#news {
    height: 275px;
    width: 545px;
    background-image: url('pliki/news_tlo.png');
    float: left;
    display: inline;
    overflow: hidden;
}

#test {
    height: 275px;
    width: 423px;
    background-image: url('pliki/test_tlo.png');
    background-position: left;
    float: left;
    display: inline;
    overflow: hidden;
}

#test_bok {
    height: 275px;
    width: 32px;
    float: right;
    display: inline;
    overflow: hidden;
}

#top {
    height: 60px;
    float: left;
    display: inline;
    overflow: hidden;
}

#dol {
    height: 68px;
    width: 1000px;
    display: inline;
}

#lewa {
    float: left;
}

#srodek {
    float: left;
}

#prawa {
    float: left;
}

#ciekawostki {
    width: 238px;
    height: 128px;
    background-image: url('pliki/tlo_maly.png');
    background-repeat: repeat-x;
    background-position: center;
    float: left;
}

#oglosz {
    width: 437px;
    height: 313px;
    background-image: url('pliki/oglosz_tlo.png');
    background-repeat: repeat-x;
    float: left;
    display: inline;
}

#foto {
    width: 230px;
    height: 128px;
    background-image: url('pliki/tlo_foto.png');
    background-repeat: repeat-x;
    float: left;
    display: inline;
}


Pozdrawiam Szymon
Go to the top of the page
+Quote Post
antstd
post
Post #2





Grupa: Zarejestrowani
Postów: 22
Pomógł: 4
Dołączył: 9.12.2007
Skąd: Tychy

Ostrzeżenie: (0%)
-----

Wydaje mi sie ze ten odstep to Twoj najmniejszy problem, ale ustaw font-size:0 dla tych divow z obrazkami. U mnie powyzsza strone "poprawnie" wyswietla tylko firefox. Pod IE i Opera totalnie sie rozjechala co mnie wcale nie dziwi, bo twoj kod to totalny chaos. Wstawianie obrazkow do uzyskania odestepu to slad poprzedniej tabelkowej epoki. Niezrozumiale jest tez display: inline dla wiekszosci divow, a uzywanie z taka czestotliwoscia oblewania to samobojstwo.

Osobiscie radze zaczac od nowa, ale najpierw warto jeszcze troche poczytac.
Go to the top of the page
+Quote Post
« Następny starszy · CSS · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 19.08.2025 - 09:25
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn