Solved

Images not showing in Visual Web Developer

Posted on 2010-11-22
15
1,214 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
SharePoint Admin?

Enable Your Employees To Focus On The Core With Intuitive Onscreen Guidance That is With You At The Moment of Need.

 

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
 
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

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the ASP.NET AJAX ModalPopupExtender control. In this article we will show how to use the ModalPopupExtender control, how to display/show/call the ASP.NET AJAX ModalPopupExtender control from javascript, how to show/display/cal…
Today is the age of broadband.  More and more people are going this route determined to experience the web and it’s multitude of services as quickly and painlessly as possible. Coupled with the move to broadband, people are experiencing the web via …
Come and listen to Percona CEO Peter Zaitsev discuss what’s new in Percona open source software, including Percona Server for MySQL (https://www.percona.com/software/mysql-database/percona-server) and MongoDB (https://www.percona.com/software/mongo-…
In this video, viewers will be given step by step instructions on adjusting mouse, pointer and cursor visibility in Microsoft Windows 10. The video seeks to educate those who are struggling with the new Windows 10 Graphical User Interface. Change Cu…

688 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