Expiring Today—Celebrate National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

CSS not working with ASP:Image

Posted on 2011-09-06
4
Medium Priority
?
279 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 400 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 1600 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

Enroll in September's Course of the Month

This month’s featured course covers 16 hours of training in installation, management, and deployment of VMware vSphere virtualization environments. It's free for Premium Members, Team Accounts, and Qualified Experts!

Question has a verified solution.

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

Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
Visualize your data even better in Access queries. Given a date and a value, this lesson shows how to compare that value with the previous value, calculate the difference, and display a circle if the value is the same, an up triangle if it increased…
In this video, Percona Solutions Engineer Barrett Chambers discusses some of the basic syntax differences between MySQL and MongoDB. To learn more check out our webinar on MongoDB administration for MySQL DBA: https://www.percona.com/resources/we…

730 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