tags:

views:

30

answers:

2

Why wont it show the whole original picture?

<div class="test"></div>


.test { 
background: url("http://i27.tinypic.com/28ktoh.jpg") no-repeat;
}

Problem is that is doesnt show anything, if you type something in the div it shows a little bit of the image. I want it to include the full picture.

http://yfrog.com/cbcrapfp

(copy paste link in css to see full picture)

A: 

Set the height of the div. The div will not be higher than you tell it to be or higher than it needs to be.

Deniz Dogan
Indeed. Could you add that if he wants to show the whole image, he may be better off using `<img>` (if appropriate)?
MvanGeest
@MvanGeest: He's using it as a background image, so I'm not sure that's appropriate here.
Deniz Dogan
He is, but maybe he shouldn't be...
MvanGeest
@MvanGeest: I'm guessing he already knows about the `<img>` tag if he's dealing with CSS. :)
Deniz Dogan
He could, but maybe he's making the wrong choice. Anyway, this discussion is now in the comments, so he'll see the pointer and look it up if he finds it necessary. (I meant to be gender-neutral, but writing *(s)he* is annoying. *He* can mean *she* anywhere I wrote it.)
MvanGeest
+1  A: 

Here is the working demo

You need to specify the height

.test { 
  background: url("http://i27.tinypic.com/28ktoh.jpg") no-repeat;
  overflow:auto;
  height:500px;
}
Sarfraz
@sAc, doesn't the width need to specified as well?
pixeltocode
@pixeltocode: That's upto OP. I just showed him what he was doing wrong.
Sarfraz