Customizing Form - Spacing/boxes

  • Posts: 49
  • Thank you received: 0
13 years 2 months ago #24777

Hi There,

One more question, could you please let me know where in the CSS I can remove some of those boxes around the form field (please see attached image with arrows in red) also I would like to add some cellpadding and cell spacing in the form fields to give it some room, please let me know where I might be able to find that - Thanks so much - this forum is the BEST.

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13377
  • MODERATOR
13 years 2 months ago #24786

You need to add such CSS in your template's CSS:

fieldset{ border: 0; }
table td{ padding:10px; }
table{ border-spacing: 10px; }

Please Log in or Create an account to join the conversation.

  • Posts: 49
  • Thank you received: 0
13 years 2 months ago #24790

Thanks again - it worked - you guys are awesome.

Please Log in or Create an account to join the conversation.

  • Posts: 4
  • Thank you received: 0
13 years 1 month ago #26997

I have the opposite as byesuzuki have, there is too mush spacing and padding. I have tried customize the css, but cant find any solution. And how can I move up the "asterisk sign" to the same level as the field?

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13377
  • MODERATOR
13 years 1 month ago #27005

Please give a link to that page. The CSS styling is based on your template so the code to use will vary based on your template. That's why we need to see it directly on the website.

Please Log in or Create an account to join the conversation.

  • Posts: 4
  • Thank you received: 0
13 years 1 month ago #27012

www.barajakt.se/166/

Thank you for the great support Nicolas!

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13377
  • MODERATOR
13 years 1 month ago #27015

The problem indeed comes from the CSS of your template.
To change that you should remove the code display: block; and margin-bottom: 10px; from the lines below in the file www.barajakt.se/166/templates/shoplab/css/styles.css

div.component input,div.component select,div.component textarea {background: -moz-linear-gradient(center top , #F1F1F1, #FFFFFF) repeat scroll 0 0 transparent;border: 1px solid #DCDCDC;margin-bottom: 10px;padding: 3px;display: block;}
input,select, textarea {background: -moz-linear-gradient(center top , #F1F1F1, #FFFFFF) repeat scroll 0 0 transparent;border: 1px solid #DCDCDC;margin-bottom: 10px;padding: 3px;display: block;}

Please Log in or Create an account to join the conversation.

  • Posts: 4
  • Thank you received: 0
13 years 1 month ago #27053

Thanks! Works great on IE & Chrome!
For some reason the problem remains on Firefox, nothing at all happend there. Any thoughts?

Please Log in or Create an account to join the conversation.

  • Posts: 82868
  • Thank you received: 13377
  • MODERATOR
13 years 1 month ago #27060

I just checked and it's displaying fine in firefox. It must be because your template CSS is still cached in your browser.

Please Log in or Create an account to join the conversation.

Time to create page: 0.057 seconds
Powered by Kunena Forum