• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 484
  • Last Modified:

Can't get CSS to control form submit button.

Hi

I am having trouble getting my css to control the background color of the submit button on a form.

I created a separate stylesheet just for the button.  The stylesheet name is rowby-canfield.css

Here's the only css on that stylesheet:

input.button {
	background-color: #ff0000;
}
	

Open in new window


Also, once I get the background color working, I want to add an image for the button.

In my next comment I will provide the URL.

Thanks

Rowby
0
Rowby Goren
Asked:
Rowby Goren
3 Solutions
 
Paul MacDonaldDirector, Information SystemsCommented:
We (I) don't have permission to read "/templates/friendsofcanfield/css/rowby-canfield.css" so the CSS is never applied.  Check the permissions on your end or even that the path exists.
0
 
Ray PaseurCommented:
See http://www.laprbass.com/RAY_temp_rowby.php

<?php // RAY_temp_rowby.php
error_reporting(E_ALL);

// CREATE A VARIABLE FOR OUR HTML
$xyz = 'Hello World';

// CREATE OUR WEB PAGE IN HTML5 FORMAT
$htm = <<<HTML5
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta charset="iso-8859-1" />
<meta http-equiv="Expires" content="Mon, 01 Jan 1990 01:00:00 GMT" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css" media="all">
.foo {
    background-color: #ff0000;
    border:2px dotted green;
}
</style>
<title>HTML5 Page</title>
</head>
<body>
<p>$xyz</p>
</body>
<form>
<input class="foo" type="button" />
</form>
</html>
HTML5;

// RENDER THE WEB PAGE
echo $htm;

Open in new window

0
 
Marco GasiFreelancerCommented:
If you have to sylish a submit element you have to write:

input[type="submit"]{
      background-color: #ff0000;
        background: url('myImage.jpg');
        background-position: 4px 4px;
        background-repeat: no-repeat;        
}

or in onle line only
      
input[type="submit"]{
      background: #ff0000 url('myImage.jpg') 4px 4px no-repeat;        
}

Cheers
0
 
Rowby GorenAuthor Commented:
Hi,

The most interesting solution was paulmacd's permission issue.  Being used to another server I assumed my uploaded stylesheet was readable by the public.  I was wrong.  And fixed the permissions.

And the other solutions... : marqusG's specifics re image, and Ray's test page all contributed to the ultimate solution.

Seemed like a minor thing -- a submit button's image -- but it works now -- and the permissions was the big initial stumbling block.   I'll pay more attention to permissions when I am on servers I am not used to!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now