Wrap div wokół obrazu

Mam div wokół obrazu tak:Wrap div wokół obrazu

<div class="q"> 
    <img src="http://upload.wikimedia.org/wikipedia/commons/a/af/Bonsai_IMG_6426.jpg" /> 
</div>

Rezultat jest taki, że div jest większy niż obraz. Chciałbym go owinąć wokół obrazu nadając mu taką samą wysokość i szerokość (bez określania wymiaru)

img { 
    z-index: -1; 
    position: relative; 
    width:300px; 
} 

.q { 
    width:100%; 
    height:100%; 
box-shadow:inset 0px 0px 85px red; 
-webkit-box-shadow:inset 0px 0px 85px red; 
-moz-box-shadow:inset 0px 0px 85px red; 
}

Próbowałem wysokość i szerokość „Auto”, ale to też nie działa.

JsFiddle

Źródło

2013-03-25 Youss

Można dodać te:

img { 
    display: block; 
} 

.q { 
    float: left; 
}

i usunąć:

.q { 
    width: 100% 
    height: 100%; 
}

jsfiddle

Źródło

2013-03-25 09:28:40 Joonas

Dziękuję bardzo :) – Youss

Ustaw margines i padding div do zera:

div.q{ 
margin:0; 
padding:0; 
}

Źródło

2013-03-25 09:24:25

Tu yo iść

<html> 
<head> 
<style type="text/css"> 
img { 
    z-index: -1; 
    position: relative; 
    width:300px; 
} 

.q { 
    width:300px;  
box-shadow:inset 0px 0px 85px red; 
-webkit-box-shadow:inset 0px 0px 85px red; 
-moz-box-shadow:inset 0px 0px 85px red; 
} 
</style> 
</head> 
<body> 
<div class="q"> 
    <img src="http://upload.wikimedia.org/wikipedia/commons/a/af/Bonsai_IMG_6426.jpg" /> 
</div> 
<body> 
</html>

Źródło

2013-03-25 09:31:13

Znalazłem ten sposób najprostszy,

<div style="display:inline-block"> 

      <p style="float: left; padding-left: 20px"> 
       <img src="Images/user.png" style="height: 200px; width: 207px" /> 
      </p> 
      <h4 style="text-align: center">Client Zone</h4> 
      <p>So, he played with that child, the whole day long, and they were very merry.</p> 
    </div>

tym przykładzie tekst w nim jednak, nawet jeśli wziąć ostatnią <p> tag <h4> a

<div style="display:inline-block;" >

"Wyświetlanie: blok inline;" zapewnia, że cały obraz zostanie zawinięty w tagu <div>.

Źródło

2015-10-02 04:38:13 user3736786

Wrap div wokół obrazu

Odpowiedz

Powiązane problemy