Mam problem z wyświetlaniem divów w wersji mobilnej. Na pc wszystko działa dobrze, jak wejde telefonem to divy, które powinny być obok siebie są pod sobą. (rysunek i tekst do rysunku powinny byś wyświetlone inline)

Prawdodpobnie nie jest to z winy szerokości elementów, bo nawet jeżeli ustawie obrazek jako 1px szerokości to text i tak nie ustawi się obok obrazka, tylko nadal będzie pod.

Link do strony: http://www.filmypodobnedo.pl/Miasto-zlodziei/

Chodzi o wyświetlanie listy podobnych filmów. W wersji mobilnej okadka filmu jest nad tekstem a nie obok.

HTML:

[PHP] pobierz, plaintext 
<div class="podobny_film">
<div id="zdjecie_podobne">
<img class="featured-project-image" width="100" height="150" alt="Filmy podobne do Equilibrium" src="http://www.filmypodobnedo.pl/photos/Equilibrium.jpg">
</div>
<div id="tekst_podobne">
</div>
[PHP] pobierz, plaintext 

CSS:

[PHP] pobierz, plaintext 
/* Wersja pod telefony */
@media only screen and (max-device-width: 480px){
 
		.featured-project-image{
		height: 100px;
		width: 67px;
		}
 
  #zdjecie_podobne {     
    width: 120px;
    float: left;
    display:inline-block;
    }
    #tekst_podobne {
    width: 75%;
    float: left;
    font-size: 16px;
    display:inline-block;
 
    } 
 
 
	}
[PHP] pobierz, plaintext 

ps. próbowałem z display:inline-block; w #tekst_podobne i #zdjecie_podobne. Nadal nie działa.

Te divi rozjezdzaja sie juz wczesniej, przy szerokosci ekranu ok. 1140px i mniejszej. Poprostu te lementy nie miszacza sie koło siebie, zdjecia ma szerokosc 120px, a text 75% szerokosci rodzica.

Daj
#tekst_podobne - width:75%;
#zdjecie_podobne - width:25%;
w obrazku pousuwaj wszystkie wymiary i daj w stylach - width:100%.

Powinno byc OK.