DIV problem z wyswietleniem

Wszystko o HTML, XHTML, XML, CSS.
juli126
Posty: 12
Rejestracja: 24 cze 2011, 12:08:26
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1366x768

DIV problem z wyswietleniem

Postautor: juli126 » 04 lip 2011, 01:25:14

Witam, mam problem z tagiem div :/ chce zrobić tabelkę z diva, gdzie w linii będą 4 divy ze zdjęciami i następnie przejść do nowej linii i znowu wyświetlić 4 divy ze zdjęciami itp.

Kod jaki mam wyświetla mi 4 divy w linii, ale nie są one równe, następnie robię <br> ale to wszystko w sumie się sypie :/

CodeColon Select All Code


echo "<div id='photos'>";
        while (
$r mysql_fetch_array($result)) {
            
$i++;
            echo 
"<div id='photo'>";
            echo 
"<a href='http://www.krystiantoporek.cba.pl/photos/photosGallery.php?name=" $r['name'] . "'> 
           <img src='http://www.krystiantoporek.cba.pl/photos/photosGalleryM/" 
$r['name'] . "' title='" $r['name'] . "' alt='" $r['name'] . "' /></a>";
            echo 
"</div>";
            
            if (
$i >= 4) {
                echo
"<br/>";
                
$i 0;
            }
        }
         echo
"</div>"



CodeColon Select All Code

#photos{/* wyswietlanie zdjec*/
        
        
background-colorred;
    
width790px;
    
height950px;    
    
overflowhidden;      
}

#photo{
        
        
width190px;
    
height190px;
    
bordersolid 1px #ccc;
    
displayinline-block;
    
letter-spacingnormal;
    
    


ma ktoś może pomyła jak to zrobić ???
Awatar użytkownika
fuma
Przyjaciel CBA
Posty: 11168
Rejestracja: 01 sie 2005, 14:57:56
Reputacja: 201
Lokalizacja: z jajka niespodzianki :P
Płeć: Mężczyzna
User Agent: Opera Windows 1440x900

Re: DIV problem z wyswietleniem

Postautor: fuma » 04 lip 2011, 06:35:44

juli126 nie mozesz kilku elementom nadawac tego samego id, dla tych div'ow co maja byc po cztery (photo) albo daj class="photo" albo nic nie dawaj i formatuj je odwolujac sie w arkuszu css do #photos.div {}. Ponadto nie potrzebujesz <br>, wystarczy ze w photos dodasz np. clear:both; margin; 1em 0;
juli126
Posty: 12
Rejestracja: 24 cze 2011, 12:08:26
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1366x768

Re: DIV problem z wyswietleniem

Postautor: juli126 » 04 lip 2011, 10:00:18

Zapomniałem o tym, że id muszą być unikalne :/ dzięki za odpowiedz, ale nie działa twój sposób, ponieważ wyświetla mi po jednym divie


CodeColon Select All Code



   
#photos{/* wyswietlanie zdjec*/

    background-color: red;
    width: 790px;
    height: 950px;    
    overflow
: hidden;        
}

#photos div {
    width: 180px;
    height: 180px;
    border: solid 1px #ccc;
    display: inline-block;
}
 


Niestety pierwszy div jest niżej od 3 następnych
LaY
Posty: 1120
Rejestracja: 28 sty 2009, 15:20:07
Reputacja: 33
Lokalizacja: Silesia
Płeć: Mężczyzna
User Agent: Opera Windows 1920x1080
Kontakt:

Re: DIV problem z wyswietleniem

Postautor: LaY » 04 lip 2011, 10:44:02

#photos.div{}
Zgubiłeś kropkę ;)
Niě nerwuj hanysa
juli126
Posty: 12
Rejestracja: 24 cze 2011, 12:08:26
Reputacja: 0
Płeć: Niewybrana
User Agent: Firefox Windows 1366x768

Re: DIV problem z wyswietleniem

Postautor: juli126 » 04 lip 2011, 10:52:10

jak dam z kropkę to wtedy nie formatuje mi diva.

Chce zrobić wyświetlanie zdjęć miniaturek w rozdzielczość 160x120 i 120x160 i wymyśliłem ze zrobię to w divach.
Chce jeszcze żeby div ze zdjęciem miał rozmiar 180x180 i żeby było w nim zdjęcie wyśrodkowane w pionie i poziomie.
Szkielet pomysłu to:

CodeColon Select All Code


<div id="photos">
    <
div>zdjecie1</div>
    <
div>zdjecie2</div>
    <
div>zdjecie3</div>
     <
div>zdjecie4</div>
<
br>
    <
div>zdjecie5</div>
    <
div>zdjecie6</div>
    <
div>zdjecie7</div>
     <
div>zdjecie8</div>
</
div


kod PHP ktory to wykonuje

CodeColon Select All Code

  echo "<div id='photos'>";
        while (
$r mysql_fetch_array($result)) {
            
$i++;
            echo 
"<div>";
            echo 
"<a href='http://www.krystiantoporek.cba.pl/photos/photosGallery.php?name=" $r['name'] . "'> 
            <img src='http://www.krystiantoporek.cba.pl/photos/photosGalleryM/" 
$r['name'] . "' title='" $r['name'] . "' alt='" $r['name'] . "' /></a>";
            echo 
"</div>";            
            if (
$i >= 4) {
                echo
"<br/>";
                
$i 0;
            }
        } 


formatowanie div:

CodeColon Select All Code


#photos{/* wyswietlanie zdjec*/

    
background-colorred;
    
width790px;
    
height950px;    
    
overflowhidden;        
}

#photos div {
    
margin0px auto;
    
vertical-align:middle;
    
width180px;
    
height180px;
    
bordersolid 1px #ccc;
    
displayinline-block;


Jeśli ma ktoś pomysł i chce się podzielić i z góry wielkie dzięki.
Aktualnie wyglada to tak:
http://www.krystiantoporek.cba.pl/photos/photos.php

Wróć do „HTML, CSS”

Kto jest online

Użytkownicy przeglądający to forum: Obecnie na forum nie ma żadnego zarejestrowanego użytkownika i 2 gości