I have template from themeforest and i dont want edit css from this template, because i don't have time for it. But i want integrate paypal buttons to my webpage, problem is paypal button use tag for selection payment option. I have overloaded style for tag and this not look like should.

How to not use CSS for this element. I dont want use and if i don't must then i dont want edit this CSS;-)

This css look wired, i must edit her to solve this problem? What is best solution for this?

/*////   - Forms -   ////*/
form {
        margin-bottom:20px;
}
body.ie7 form, body.ie8 {
        margin-bottom:40px;
}
form p {
        margin-bottom:15px;
}
form label {
        float:left;
        width:140px;
        margin-top:5px;
}
form input, form textarea, form select {
        padding:10px 5px;
        background:#fff url(../img/bg-input.gif) repeat-x top;
        border:1px solid #D9D9D9;
        width:448px;
        border-radius:3px;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
}
form input.small {
        width:35px;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header,
hgroup, menu, nav, section, menu,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

Can anyone help me?

link|improve this question
feedback

2 Answers

up vote 2 down vote accepted

You could reset those rules to have them display the custom rules you have in your CSS. You can wrap the Paypal buttons in a <div class="paypalbutton"> and then use CSS resembling this:

div.paypal form {
        margin-bottom: 0;
}
div.paypal body.ie7 form, div.paypal body.ie8 {
        margin-bottom: 0;
}
div.paypal form p {
        margin-bottom: 0;
}
div.paypal form label {
        float: none;
        width: auto;
        margin-top: 0;
}
div.paypal form input, div.paypal form textarea, div.paypal form select {
        padding: 0;
        background: transparent;
        border: 2px inset #D9D9D9;
        width: auto;
        border-radius: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
}

I don't know if that will reset them exactly but I hope it gives you the idea.

link|improve this answer
feedback

Since your CSS declarations are element declarations, the only option you have is to give your particular form an id and write/reset it's css attributes.

form#paypal_form {
    custom styles;
}

form#paypal_form label {
    custom styles;
}

and so on.

link|improve this answer
feedback

Your Answer

 
or
required, but never shown

Not the answer you're looking for? Browse other questions tagged or ask your own question.