Is there a way to change the font and font size of the submit button?

input[type='submit']{font-family: 'Oswald', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; }

input[type='submit']{ font-size: 20px; } 

I tried this, however it didn’t work. Any idea why?

I customized the font and the size of the other buttons, so wondering if there’s a way to customize the contact form buttons as well?

Best,
Rubie

Fantastic!!!

Thank you very much, this solves my issues!

Sorry but that doesn’t seem to be working. I have cleared the Cache.

Please advise.

I removed the background image from the Color section and added the above css to Quick CSS as you suggested. The background image is not centered and is not resizing responsively when the larger random quotes appear.

Any ideas?

* FYI: I previously placed the following styles in the enfold-child/style.css file to style the quotes and author:

/* START Easy Random Quotes plugin section */

/* jv: investigate > For Developers: Section ID > id="section-quotes" later.
#section-quotes {
	background-color: #bbff00;
}
*/

#quotes {
	text-align: center;
	margin: 0 5%;
}

/* jv: Formats quote */
p.quotes-caption {
	margin: 0 0;
	font-size: 1.25em;
	line-height: 1.3em;
	color: #0f75bc;
}

/* jv: Formats quote signature under quote */
p.quotes-signature {
	margin: 5px 0 0 0;
	font-size: 1.15em;
	line-height: 1.3em;
	font-style: italic;
	color: #898989;
}

/* END Easy Random Quotes plugin */

Thanks! I added that but when I scroll down (using a sized down browser window) I can still faintly see the text behind the header when it scrolls up.

Here are the full contents of Quick CSS

.logo, .logo img {
max-width: 340px !important;
width: 340px !important;
height: auto !important;
max-height: none !important;
}
.logo img{
position: relative;
top: -40px;

}
body {
font-size: 15px;
}
.avia_message_box_content { text-transform: capitalize; }

#header_main .container, .main_menu ul:first-child > li > a {
height: 88px !important;
line-height: 88px !important;
}

html.fixed_header #main {
padding-top: 88px;
}

.logo a {
max-height: none !important;
}

That is very helpful!
One last question.

How do I make the TEXT in the button a bigger size? I didn’t see it in the button options and I’m not sure what the CSS would be.

Thank you so much for your help!!!

What about changing the button from the rounded corners to a more rectangular look?

the code generated is :

<div class="avia-button-wrap avia-button-left  avia-builder-el-8  el_after_av_icon_box "><a href="" class="avia-button avia-icon_select-yes avia-color-theme-color avia-size-medium avia-position-left "><span class="avia_button_icon" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title">2012</span></a></div>
<br>
<div class="avia-button-wrap avia-button-left  avia-builder-el-9  el_after_av_button "><a href="" class="avia-button avia-icon_select-yes avia-color-theme-color avia-size-medium avia-position-left "><span class="avia_button_icon" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title">2011</span></a></div>
<br>
<div class="avia-button-wrap avia-button-left  avia-builder-el-10  el_after_av_button  avia-builder-el-last "><a href="" class="avia-button avia-icon_select-yes avia-color-theme-color avia-size-medium avia-position-left "><span class="avia_button_icon" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title">2010</span></a></div>
<p></p>

@Devin Hi, thanks for the help. However, that code didn’t work either, and the font size or color doesn’t work either, I tried another color and a bigger font, and nothing changes. Nothing I type in the Quick CSS seems to work. Do you have any idea why that can be? I really need it to work very soon. Would really appreciate more help. Thank you /Rubie

@Devin Hi!

This is the code I wrote. I don’t see these modifications on the page. Not the logo, or the font or size of the menu.

Thank you!
Rubie

#top .logo img {
width: 156px;
height: 156px;
}

/*header with social icons: */
.social_header #header_main .container, .social_header .main_menu ul:first-child > li a { height: 200px; line-height: 116px; }

#top .main_menu .menu li > a {

font-family: “Terminal Dosis”, sans-serif;

font-size: 24px; color: #999; text-transform: uppercase;

}

Hey :)

so … i think, i figured out, that the basic.css from the ubermenue is overwriting your css File:
The releated part seams this one:
media=”all”
#megaMenu.megaResetStyles div, #megaMenu.megaResetStyles span, #megaMenu ul.megaMenu, #megaMenu ul.sub-menu, #megaMenu ul.um-sidebar, #megaMenu li.menu-item, #megaMenu li.widget, #megaMenu li.menu-item > a, #megaMenu img.um-img {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
text-shadow: none;
visibility: visible;
opacity: 1;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
-o-box-sizing: content-box;
box-sizing: content-box;
-webkit-backface-visibility: visible;
-moz-backface-visibility: visible;
-ms-backface-visibility: visible;
-o-backface-visibility: visible;
backface-visibility: visible;
}

I played around with the developer tools from the chrome browser. When i disable the “font-size: 100%”, then your search Icon will appear bigger.
I’m not really firm with CSS. is there a possibility to solve the stuff in the Enfold Theme, or should i contact the ubermenue support ?

Another idea … i can setup a testing wordpress installation for you, with Enfold and the Ubermenu Plugin. Also with FTP access and so on.
I think, when this would be necessary, i can do this on weekend ..

Br,
Martin

P.S. perhaps it could be a great idea, to implement the possibility to use a graphical menue with Enfold :)

• This reply was modified 12 years, 2 months ago by mwolfert.