Solved

CSS not working with ASP:Image

Posted on 2011-09-06
4
278 Views
Last Modified: 2012-06-21
I have an image on my ASP.Net page defined as follows:

                      <asp:Image ID="ImgPantry" runat="server" BorderStyle="None"
                          CssClass="borders_on" ImageUrl="~/images/HomePagePics/Pantry.jpg" />

which renders as this:

<img id="ImgPantry" class="borders_on" src="images/HomePagePics/Pantry.jpg" style="border-style:None;border-width:0px;" />

The borders_on is defined as follows in styles.css which is attached to the ASP.NET page:

.borders_on
{
      border:3px solid #000000;
    height:100px;
    width:200px;
}

Not sure what I'm doing wrong but the border is not being displayed around the picture.  The Height and Width are set but the border is not.  Any idea what I'm doing wrong?
0
Comment
Question by:dyarosh
[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
  • 2
4 Comments
 
LVL 18

Expert Comment

by:ivan_vagunin
ID: 36487916
Hi! It is a kind of bug - framework adds style="border-style:None;border-width:0px;" to <img> which overrides class attributes.
Try this solution:
http://forums.asp.net/p/1208356/2124354.aspx
0
 
LVL 18

Assisted Solution

by:ivan_vagunin
ivan_vagunin earned 100 total points
ID: 36487927
You can use server <img> instead of <asp:Image>:
<img id="ImgPantry" class="borders_on" src="images/HomePagePics/Pantry.jpg" runat="server" />
0
 
LVL 19

Accepted Solution

by:
Albert Van Halen earned 400 total points
ID: 36487984
Alternatively you can use !important in your style rule like this :
.borders_on
{
    border: 3px solid #000000 !important;
    height: 100px;
    width: 200px;
}

Open in new window


Another option is to remove BorderStyle attribute (which will render the inline style of the element) of the asp:Image
0
 

Author Closing Comment

by:dyarosh
ID: 36488325
I awarded points to both responders but awarded more points to AblertVanHalen because his solution was easier to implement given the way I am doing things.  Thank you for your help.
0

Featured Post

Ready to get started with anonymous questions?

It's easy! Check out this step-by-step guide for asking an anonymous question on Experts Exchange.

Question has a verified solution.

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

ASP.Net to Oracle Connectivity Recently I had to develop an ASP.NET application connecting to an Oracle database.As I am doing it first time ,I had to solve several problems. This article will help to such developers  to develop an ASP.NET client…
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…
Monitoring a network: why having a policy is the best policy? Michael Kulchisky, MCSE, MCSA, MCP, VTSP, VSP, CCSP outlines the enormous benefits of having a policy-based approach when monitoring medium and large networks. Software utilized in this v…
Add bar graphs to Access queries using Unicode block characters. Graphs appear on every record in the color you want. Give life to numbers. Hopes this gives you ideas on visualizing your data in new ways ~ Create a calculated field in a query: …
Suggested Courses

630 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