• Locked
2 replies [Last post]
Mon, 2012-11-19 09:32
ricky spires
ricky spires's picture
Offline
newbie
Last seen: 9 years 32 weeks ago
Joined: 2012-11-19
Posts: 1
Points: 2

hello.

im having trouble with the sizing of my background image

if i do this the image resizes to 300px which is great:

#wrapper{
    width:100%;
    height:300px;  
}
.size{
    width:300px;
    height:300px;
    margin: 0 auto;
}
.size img{
    width:100%;
}
 
<div id="wrapper">
    <div class="size">
        <img src="cont-bg.png"/>
    </div>
</div>

but if i do this, the image will not resize with the div. 

#wrapper{
    width:100%;
    height:300px;  
}
.size{
    width:300px;
    height:300px;
    margin: 0 auto;
    background-image:url(cont-bg.png);
    background-repeat: no-repeat;
}
 
 
<div id="wrapper">
    <div class="size">
    </div>
</div>

so....

how do i get my image to resize to fit the 300x300 div when adding the image into the css and not in the html ???

thanks
ricky

Top
Tags:
Mon, 2012-11-19 11:47
#1
Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 3 weeks 2 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

Hi ricky, Have a look into

Hi ricky,
Have a look into background-size

Top
Mon, 2012-11-19 22:11
#2
rickyspires
rickyspires's picture
Offline
newbie
london
Last seen: 9 years 32 weeks ago
london
Joined: 2010-12-20
Posts: 7
Points: 11

no good

hello.

thanks but i tried that and they dont work. i guess its my browser but im looking for an answer css2 stylee Smile

Top
  • Locked