Hallo Developers
I would love to have this implented in shipping 1.5 version.
Is it possible to change all occurrences of <input type="submit" or <input type=\"submit\" to <input id="submitbutton" id="submit" to have a better css layout.
Thanks in advance.
Hi Anjin Sing,
my first thought was: "good idea". Secondly I saw that Moodle uses a lot over 100 submit buttons of quite different kinds and with different functions. Now I am not sure if a general change with CLASS="submitbutton" would help. I think it would be much better to style the buttons depending on their place and function with descending CSS. It's more work but you get a better result.
Can you please tell and even better show us what you want to do?
@"<input id="submitbutton" id="submit""
By the way, the ID is an individual identifier of one and only one object in one page. A general classification should always be a CLASS.
opps, soory
I meant
<input id="submitbutton" type="submit"
naturally. 
I am using something like this
#submitbutton {
padding: 1px;
background: url(button_background.png) repeat-x top;
color: #1D2E3F;
font-weight: bold;
font-size: 0.9em;
border: 1px outset #000;
margin: 2px;
}
I used id while class was not working everywhere.
Hi Martin,
yes I see, its a lot of work. But I have done it already with latesd 1.5 of yesterday morning. So if someone wants to have for the cvs I can send it....
I just put a submitbutton id everywhere where we have a kind of button, there are just one or two missing, I can´t find....
yes I see, its a lot of work. But I have done it already with latesd 1.5 of yesterday morning. So if someone wants to have for the cvs I can send it....
I just put a submitbutton id everywhere where we have a kind of button, there are just one or two missing, I can´t find....
Hi,
just now I read this excellent article about web forms and how the different browsers display them Styling even more form controls.
The article and especially the conclusion at the end of the article opened my eyes to not investigate too much effort because many browsers make my efforts useless:
"In conclusion: trying to style form controls to look the same across platforms is often a waste of time. Leave them to the browser/operating system defaults, or do only very light styling. That way you will save yourself and your sites visitors a lot of frustration."
Urs
Hi Urs
I just snip this little piece of code here, which solved my problems without changing all the pages containing buttons or submits. Maybe someone has fun with it or we can even use it in general.
Ian
----snip----
input[type="submit"], input[type="button"] {
margin: 2px;
padding: 1px;
background: url(button_background.png) repeat-x top;
border: 1px outset #000;
color: #1D2E3F;
font-size: 0.9em;
font-weight: bold;
}
I just snip this little piece of code here, which solved my problems without changing all the pages containing buttons or submits. Maybe someone has fun with it or we can even use it in general.
Ian
----snip----
input[type="submit"], input[type="button"] {
margin: 2px;
padding: 1px;
background: url(button_background.png) repeat-x top;
border: 1px outset #000;
color: #1D2E3F;
font-size: 0.9em;
font-weight: bold;
}
Thanks a lot Anjin (or Ian?)
For what browsers do you use the attribute selectors?
For those being interested I post a link to the Attribute selectors on w3.org.
Have fun
Urs
FYI--This is not a cross-platform solution. Styling form button is almost completely useless on the Mac (you can style the font-size and that's about it), so don't waste your time if you have Mac users.
Hi Anjin,
Thanks for sharing your little piece of code for customizing the look of submit buttons :
input[type="submit"], input[type="button"] { etc.
I confirm that it is working fine under Windows XP with Firefox, but not with MSIE 6.0.
With Firefox you can even take it one step further, by adding an input[type="button"]:hover class - again not working with MSIE. The way to css customization of buttons with MSIE (and maybe other platforms) is, as you suggested, to have proper classes added to the various input buttons present throughout Moodle, but it seems that the idea has been abandonned... too bad - until we all move to Firefox (or MSIE 7 makes it possible?)
Joseph
PS About Macs: in my working environment they are very thin on the ground...
According to Microsoft attribute selectors will make it into IE 7 - though they aren't included in the first beta release.
http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx
of course by the time that is released everyone else will already be supporting CSS 3 selectors
until this can be done with pure CSS - and if you're desperate to have styled buttons - it might be a case where some javascript could help,
http://blogs.msdn.com/ie/archive/2005/07/29/445242.aspx
of course by the time that is released everyone else will already be supporting CSS 3 selectors
until this can be done with pure CSS - and if you're desperate to have styled buttons - it might be a case where some javascript could help,
function styleButtons() {
if (!document.getElementsByTagName) return;
var inputs = document.getElementsByTagName('input');
var i = inputs.length;
while (i--) { // loop through all input tags on the page
var type = inputs[i].getAttribute('type').toLowerCase();
if (type == 'submit' || type == 'button') { // and apply a class to the buttons
inputs[i].className = 'button-class';
}
}
}
if (window.addEventListener) {
window.addEventListener('load', styleButtons, false);
} else if (window.attachEvent) {
window.attachEvent('onload', styleButtons);
}