Custom css for submit button

busch09 13 Mar, 2010

Id like to use my site css style for the submit buttons. I tried to edit the form css and form html, but i always get this grey box, and I cannot find where I need to edit to alter the box to plain text. I searched the forums but could not find any post that explains ho to make a custom bustton style.

<div class="readon-wrap1"><div class="readon1-l"></div><a class="readon-main"><span class="readon1-m"><span class="readon1-r"><input  class="readon-main" type="submit" value="Send" /></span></span></a></div>

How do I get rid of the grey box around the submit text ?
GreyHead 13 Mar, 2010
Hi busch09,

You'll need to check an HTML reference but I think you need to set the input to type='image'.

busch09 14 Mar, 2010
Bob, you are not helping.
GreyHead 14 Mar, 2010
Hi busch09,

Perhaps not - are you saying that your buttons aren't using an image but are plain css? Then there is an example here. I think you can add the CSS wherever is appropriate as ChronoForms uses the default browser button styling


PS Just for info, there's a sticky post in every forum calleGd 'Asking questions in the forum'. It says in part:

"G. Please don't ask us to give you basic help with HTML, CSS, PHP or JavaScript. If you want to use the full power of ChronoForms and of Joomla then you ae going to need some basic coding skills. There are excellent tutorials on the net and they should really be your first point of reference. Michelle Steigerwalt's post on the Mootools blog "Help I don't know JavaScript" is an excellent place to start - not just for JavaScript."
busch09 14 Mar, 2010
that helped, but what I am looking for is how to edit the css so that all forms have the same custom image button, without editing the form html or form css in every form. Id like to have identical custom inputboxes and submit buttons across my site without editing eash form html with a class tag

as far as I can see the default submit does not have a class, so is there a way to make the <input value="Submit" name="button_1" type="submit" /> look differently, without editing the form html or form css?
busch09 14 Mar, 2010
ok got it...

insert into /components/com_chronocontact/themes/default/css/style1.css

input[type="submit"] {background: url(/images/cancel.png) 0 0 no-repeat;color: #524B44;}
This topic is locked and no more replies can be posted.