Solved

Images not showing in Visual Web Developer

Posted on 2010-11-22
15
1,209 Views
Last Modified: 2012-05-10
I am using Visual Web Developer 2008.
I have code in the stylesheet to display a box with rounded corners.
The images show in the Design view, and they show when I view the live web site, but they do not show when I run Debug.
Any ideas?

Here is some of the code in the stylesheet.


.roundedcornr_box_light_blue {
      background: url(/assets/images/roundedcornr_light_blue_tl.png) no-repeat top left;
}
.roundedcornr_top_light_blue {
      background: url(/assets/images/roundedcornr_light_blue_tr.png) no-repeat top right;
}
.roundedcornr_bottom_light_blue {
      background: url(/assets/images/roundedcornr_light_blue_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom_light_blue div {
      background: url(/assets/images/roundedcornr_light_blue_br.png) no-repeat bottom right;
}
.roundedcornr_content_light_blue {
      background: url(/assets/images/roundedcornr_light_blue_r.png) top right repeat-y;
}
0
Comment
Question by:rrhandle8
  • 9
  • 6
15 Comments
 
LVL 21

Expert Comment

by:masterpass
ID: 34192496
you may want to use the width/ height attribute to get it done

.roundedcornr_box_light_blue {
      background: url(/assets/images/roundedcornr_light_blue_tl.png) no-repeat top left;
      width: 100px;
      height: 100px;
}

give the exact height and width as per the image .. for eg : if the image is 100 x 100 px , give as above
0
 

Author Comment

by:rrhandle8
ID: 34192790
That did not work.  No images showed anyplace, not even the live site.
0
 
LVL 21

Expert Comment

by:masterpass
ID: 34192807
Can you provide the link to the live site so that I can take a look ?

also, I dont think you will need a "/" infront of the assets , change it to

 background: url(assets/images/roundedcornr_light_blue_tl.png) no-repeat top left;
0
 

Author Comment

by:rrhandle8
ID: 34192845
http://www.ticketstoregame.com/styling.aspx
See the boxes at the top of the page with purple and light blue outlines.  Works just fine on the live site, and in Design view.  Does not show when you run Debug.
0
 

Author Comment

by:rrhandle8
ID: 34192854
BTW: If you remove the leading / mark, nothing shows.
0
 
LVL 21

Expert Comment

by:masterpass
ID: 34192968
this is weird !!!

can you try to replace this class ONLY in ur DEBUG mode and let me know if the image shows up !!!

.roundedcornr_box_light_blue {
      background: url(http://www.ticketstoregame.com/assets/images/roundedcornr_light_blue_tl.png) no-repeat top left;
}

0
 

Author Comment

by:rrhandle8
ID: 34193035
Yes, that worked in Debug mode.
0
What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

 
LVL 21

Expert Comment

by:masterpass
ID: 34193073
Are you sure you have the images in your local machine ? can you please verify the directory structure
( I know this sounds weird, assuming u published your site from the visual web developer) ...

try to add an image tag in site and choose the imageurl using "choose url" ... so that you will get an idea as to how the url is being refereed in the Visual Web Developer and just copy over the path as the URL .. that is the only way that I see to figure out what went wrong

hope this helps !
0
 

Author Comment

by:rrhandle8
ID: 34193100
Yes, they are on my local machine.  As I said, they show when you click the Design tab in VWD.

I cannot "choose url" because it is in the stylesheet.
0
 
LVL 21

Expert Comment

by:masterpass
ID: 34193117
yup .. that is why I asked you to put a test image tag in the designer

<asp:image id="someid" ImageUrl=

u will get a chooseurl when you put the = in the markup and choose the url so that you will know how the visual  web developer references the url
0
 

Author Comment

by:rrhandle8
ID: 34193151
Anything I use <asp:image id="someid" ImageUrl= with works fine.  All the images show.  It is just the images in the stylesheet.  Does that make sense?
0
 

Author Comment

by:rrhandle8
ID: 34193179
Is this what you meant:

<asp:Image ID="Image3" runat="server"
            ImageUrl="~/Assets/Images/roundedcornr_light_blue_bl.png" />
0
 
LVL 21

Accepted Solution

by:
masterpass earned 250 total points
ID: 34193321
Did you try changing the url in the css exactly like that ?

background: url('~/Assets/Images/roundedcornr_light_blue_bl.png') no-repeat top left;

or

background: url('/Assets/Images/roundedcornr_light_blue_bl.png') no-repeat top left;

or

background: url('Assets/Images/roundedcornr_light_blue_bl.png') no-repeat top left;

try all the above !



0
 

Author Comment

by:rrhandle8
ID: 34193627
Tried them all, and retried them all.  Nothing.
0
 

Author Comment

by:rrhandle8
ID: 34193763
Solution:
background: url(../../assets/images/roundedcornr_light_blue_tl.png) no-repeat top left;

Go figure.  It worked just fine the way it was in the Design view, and on the live site.  I am confused.

Anyways, you made a heroic effort to help me.  Thank you!
0

Featured Post

Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

Join & Write a Comment

IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
User art_snob (http://www.experts-exchange.com/M_6114203.html) encountered strange behavior of Android Web browser on his Mobile Web site. It took a while to find the true cause. It happens so, that the Android Web browser (at least up to OS ver. 2.…
Excel styles will make formatting consistent and let you apply and change formatting faster. In this tutorial, you'll learn how to use Excel's built-in styles, how to modify styles, and how to create your own. You'll also learn how to use your custo…
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now