Kolor tła wybija się spod zdjęcia

Witam,
Nie mam pojecia dlaczego u dołu spod zdjęcia wybija się różowe tło. Tzn wiem, że sam ustawiłem taki kolor aby oddzielić divy, ale nie mam pojęcia dlaczego wychodzi spod zdjęcia.

Stworzyłem następujący układ divów:

<div id="fblike">
   <div id="imie">Josiph</br>Havranek </div>
   <div id="fb"><i class="icon-facebook-official"></i></div>
   <div id="in"><i class="icon-linkedin-squared"></i></div>
</div>
<div style="clear: both;"></div>

<div id="container"> 
   <div id="topbanner">Lorem ipsum</div>
   <div id="menu">H</div>
   <div id="photo"><img src="zdjeciecv2.jpg" id="fota"></div>
   <div id="contentdiv">U</div>
   <div style="clear: both;"></div>
           <div id="buttons">
                   <div style="margin-left: 0px;" class="button">B</div>
                   <div class="button">B</div>
                   <div class="button">B</div>
                   <div class="button">B</div>
                   <div class="button">B</div>
                   <div class="button">B</div>
                   <div class="button">B</div>
                   <div class="button">B</div>
                   <div style="margin-right: 0px;" class="button">B</div>
            </div>  
   <div style="clear: both;"></div>
        
   <div id="footer">Copryright</div>

</div> 

Oto style dla obiektu photo i contentdiv.

#contentdiv
{
background: yellow;
}

#photo
{
background: violet;
float: left;
}
 

Pozdrwiam i dziekuje,
Witek

weź to jakoś sformatuj bo nikt Ci w to nie zajrzy..

Wychodzi bo przeglądarka ma swoje domyślne style. Dodaj line-height: 0px; do #photo i nie będzie wychodziło nic :P

Weź color picker lub coś podobnego i znajdź kod hexa tego koloru. https://addons.mozilla.org/pl/firefox/addon/colorpicker/
Potem poszukaj w źródłach tego kodu.

Jeśli nie znajdziesz to:

• sprawdź czy ten różowy to element zdjęcia czy strony. Dodaj w zdjęciu (JPG/PNG/BMP) ramkę czarną i zobacz czy różowy wychodzi w środku czy poza nią.
• jeśli różowy zniknął lub jest wewnątrz ramki to miałeś przezroczystość i zdjęcie do poprawy
• jeśli różowy jest poza ramką i nie znalazłeś kodu to sprawdź w innej przeglądarce

Witaj, dzieki za odpowiedz. Na załączonej grafice jest właśnie ramka wokół zdjęcia a różowy to kolor wystaje poza nią i jest kolorem tła diva w którym wrzuciłem zdjęcie. Ustawiłem go aby móc kontrolować położenie divów względem siebie. Zarówno na Chromie jak i Explorerze pasek ten wystaje poza zdjęcie choć powinien znikać pod nim :/

Div to element blokowy, a img inline, a każdy element inline ma miejsce "pod sobą" na kolejne.
Ustaw height i masz problem zgłowy lub display:block na img, lub vertical-align: middle :)
https://jsfiddle.net/d8zzbho2/4/

Przykład z użyciem elementu span(default display:inline;) i p(default display:block;), gdzie obydwa div'y mają ustawiony bg na violet:
http://jsfiddle.net/trL1b4Lb/2/

Działa wyśmienicie :) Zdaje się, że musze poczytać o elemntach inline i block.. gdyż nie do końca rozumiem mechanikę tego co się zadziało :)

Pozdrawiam gorąco,
Witek