CODEWITHSUNDEEP
asp.netcssbackground-image
WizLiz
WizLiz

Reputation: 2098

background-image wont show in aspx page

Im trying to put an link to a page and put an image as background (which would change when you hover on it). Im using the following code :

<asp:Content ID="Content2" ContentPlaceHolderID="MainPlaceHolder" runat="server">
    <div>
        <a href="WebForm.aspx" style="width:250px; height: 250px; background-image:url(Ressources/catalogueGC.jpg);" ></a>
    </div>
</asp:Content>

No matter what I've tried the image wont show in the div. If I put some text between the <a> and the </a>, the text shows correctly, however no trace of the image. I'm 100% sure the image does not 404 and its url is correct.

Any help would be great. Thanks

Upvotes: 0

Views: 152

Answers (2)

Curtis
Curtis

Reputation: 103378

By default anchor elements are displayed inline.

Assign display:block CSS property to the anchor.

<a href="WebForm.aspx" style="display:block; width:250px; height: 250px; background-image:url(Ressources/catalogueGC.jpg);" ></a>

Upvotes: 2

Abhitalks
Abhitalks

Reputation: 28417

Anchors are inline elements.

You need to add this to your css:

display: inline-block;

Now, it will take up the width and height, and will be able to show the background. inline-block will cause it to behave like a block element, but still remain inline.

Upvotes: 2

Related Questions