Tell me more ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

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?

share|improve this question

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.

share|improve this answer

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.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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