ActiveDen

css3 pie and compatibility issues in different browsers

117 posts
  • Exclusive Author
  • Has been a member for 3-4 years
partnuz says

I want to add rounded corners to input and a element using a css3pie. However when applied to a tag there are strange padding issues as you can see in the image below.

2312 posts
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Author had a Free File of the Month
  • Bought between 10 and 49 items
  • Europe
  • Exclusive Author
  • Has been a member for 4-5 years
  • Referred between 100 and 199 users
+1 more
CreativeMilk says

the code it self?

117 posts
  • Exclusive Author
  • Has been a member for 3-4 years
partnuz says

Hmmm what do you mean mark ?

2312 posts
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Author had a Free File of the Month
  • Bought between 10 and 49 items
  • Europe
  • Exclusive Author
  • Has been a member for 4-5 years
  • Referred between 100 and 199 users
+1 more
CreativeMilk says

Hmmm what do you mean mark ?

well if you want to have a solution for this you have to provide us the code, otherwise you wont get any solutions for this ;)

117 posts
  • Exclusive Author
  • Has been a member for 3-4 years
partnuz says

Here my css code

  .button{
    position: relative;
    text-transform: uppercase;
    font-size: 8pt; 
    padding: 6px 5px;
    color: #404040;
    -moz-border-radius: 5px;
       -webkit-border-radius: 5px;
       border-radius: 5px;
       behavior: url(js/PIE.htc);
      background-image: url('images/shared/button_bg.png');
      background-position: 0px center;
      background-repeat: repeat-x;
      border: 1px solid #666;
      -moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.1);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
  }
And here’s a html part
      <div class="float_right">

        <form name="search" method="post" action="">
          <input size="27" class="search" value="Search this site" type="text" onfocus="this.value=''" />

          <a href="" class="button" onclick="search.submit()" style=" vertical-align: middle">
          search
          </a>

        </form>
      </div>
1012 posts
  • Author had a Free File of the Month
  • Bought between 10 and 49 items
  • Egypt
  • Exclusive Author
  • Has been a member for 2-3 years
  • Referred between 10 and 49 users
  • Sold between 10 000 and 50 000 dollars
+1 more
wizylabs says

for some odd reason, I couldn’t manage to get PieCSS working at all

2312 posts
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Author had a Free File of the Month
  • Bought between 10 and 49 items
  • Europe
  • Exclusive Author
  • Has been a member for 4-5 years
  • Referred between 100 and 199 users
+1 more
CreativeMilk says

Well i got it to work, but it still has some bugs in it.

Put the pie at the bottom, below the -moz-box-shadow.

Also for some reason this pie doesn’t works that well with borders

117 posts
  • Exclusive Author
  • Has been a member for 3-4 years
partnuz says

Hmm moving it down doesnt work

Note that sometimes css 3 pie makes items invisible. All you have to do is add position:relative

by
by
by
by
by