ugrás a tartalomhoz

DIV-ben kép szöveg egymás mellett

vtsoftware · 2010. Dec. 29. (Sze), 20.12
Üdv mindenkinek.

Előre is elnézést kérek, mivel majdnem biztos volt már ilyen téma, de fogalmam sincs hogy keressem...

A gondom a következő.
Adott egy div, benne egy 16x16-os ikon, mellette pedig egy szöveg:
  1. <div class="box">  
  2.   <IMG src="images/icon.gif"> BOXCÍM  
  3. </div>  
(CSS-ben csak a .box-hoz nyúlok, keretet adok neki.)

... a kép viszont 3px-el magasabban van mint a szöveg.
Ha a képnek ...
  1. margin-top: 3px;  
...-et mondok, akkor a szöveg is lejjebb csúszik 3px-el.

Tehát ez lesz az előzőből:
  1. <div class="box">  
  2.   <IMG src="images/icon.gif"><div style="display: inline;margin-bottom: 3px;>BOXCÍM</div>  
  3. </div>  
Így pedig minden marad a helyén.

Valakinek lenne ötlete hogy lehetne a képet és a szöveget "egy síkba hozni"?
Tehát a kép és a szöveg "teteje" egy szintbe essen.

Előre is köszönöm
‹ Slimob és imageScroll probléma Charset és ajax probléma ›
 ■
1

line-height

Poetro · 2010. Dec. 29. (Sze), 20.20
line-height: 16px;
2

Már megvolt...

vtsoftware · 2010. Dec. 29. (Sze), 20.26
Ezt már próbáltam.
Akár hova adom meg - ha a képnek, ha a címnek, ha a box-nak - mindig a kép marad fentebb.
3

vertical-align

Poetro · 2010. Dec. 29. (Sze), 20.42
  1. <!DOCTYPE HTML>  
  2. <html lang="en-US">  
  3. <head>  
  4.   <meta charset="UTF-8">  
  5.   <title></title>  
  6.   <style type="text/css">  
  7.     .box {  
  8.       line-height: 16px;  
  9.       font-size: 12px;  
  10.     }  
  11.     .box img {  
  12.       vertical-align: bottom;  
  13.       width: 16px;  
  14.       height: 16px  
  15.     }  
  16.   </style>  
  17. </head>  
  18. <body>  
  19.   <div class="box"><img height="16" width="16" src="http://weblabor.hu/misc/favicon.ico" alt="icon" /> Szoveg</div>  
  20. </body>  
  21. </html>  
4

Már megint...

vtsoftware · 2010. Dec. 29. (Sze), 20.57
Poetro... már megint ott a pont.
A vertical-align: bottom; volt a gyógyír.

Nekem nem igazán jutott volna eszembe.
Nagyon szépen köszönöm.