Question

Here is my CSS code:

.header-text {
   -moz-border-bottom-image: url('images/tour_tab_border.gif') 27 27 27 27 stretch stretch;
   -webkit-border-bottom-image: url('images/tour_tab_border.gif') 27 27 27 27 stretch stretch;
   -o-borderbottom-image: url('images/tour_tab_border.gif') 27 27 27 27 stretch stretch;
 }

And my HTML code:

<div>
  <h1 class="header-text" >let's Knockout Poverty in India!</h1>
</div>

Why is my border image not showing?

Answer 1

Actually I don’t see if there is a -moz-border-bottom-image property, you probably need -moz-border-image. It allows you to set border-width so you can do something like

-moz-border-image: url('images/tour_tab_border.gif') 0 0 27 0 stretch stretch;

if you need only a bottom border, and the same for all other properties.