Body Page or Contact Form Manual CSS Color
-
Hello!
I am having trouble figuring out if there is a way to change the background color of the body part of an individual page, and/or the background color of the WordPress.com Contact Form.
I am not looking of a way to change the blue page part, but the white page part. Only CSS I have found changes for the blue part on this page (http://mypaperpusher.wordpress.com/contact-us-my-paper-pusher/), but not the white body container. As you can see, it is difficult to see the Contact Form.
Please help if possible!
The blog I need help with is: (visible only to logged in users)
-
Hi there, you can add the following which puts a border around the contact form input fields and then adjust the width and color as desired.
input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], textarea { border: 1px solid #000000 !important; }Or you could change the background color of the fields with the following.
input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], textarea { background: #ddd; } -
-
-
Would you know the CSS code for diminishing the white space in between the header masthead site header image and the main menu/main navigation?
As well as the dark blue footer area between the colophon site footer border and the widgets (image and text)?
-
I’m not entirely clear on what you mean for the first section but try this out and see how it goes:
#home-featured-slideshow { margin-top:10px; } #colophon .footer-widget-area { padding-top:10px; }You also have a really wide image in your header which is forcing horizontal scrollbars even on my desktop monitor – definitely something to try and avoid.
-
Thank you. That helped for the bottom and slideshow;however, is there a way to decrease the space above the main navigation menu?
Also, how would I fix the issue of the horizontal scrollbars?
-
Ah, now I see what you mean:
#masthead .site-branding { margin-bottom:0; }To fix the sideways scroll issue the first thing I would recommend is editing and re-uploading your header image so it’s not almost 1200px wide!
-
Thank you!
Would you know specific dimensions? Also, it seems the number does not line up with every margin, and I am not sure what width I need to set that at at, in order to line up with the menu margin?
-
-
Oh wow, I just copied and paste that code and magic, I’m liking this! may I please ask what happens if I save something then later decide I want to revert back to previous or an earlier original?
-
@mypaperpusher, I would suggest something about 750px wide for the header image as that is about the width of the content area.
-
@singlemumtravels, you are using a different them than @mypaperpusher and in general CSS is theme specific, so your site would need different CSS typically. If you need help with customization on your site, can I ask you to create a new thread in the CSS Forum and we will be happy to help you out.
If you add custom CSS and then later want to remove it, you can do so by going to Appearance > Customize > CSS, delete all the CSS in that window and then save and everything will revert back to the original design.
- The topic ‘Body Page or Contact Form Manual CSS Color’ is closed to new replies.