Indie-Resource.com

Trying to stylize my user registration screen and have run into a problem.

In my style.css file I have this:
Then in my registration page, I have this: What is happening is the password box gets the custom style, but the textbox does not. I tried styling each one individually (just do #pageMiddle > #register > input[type=text] and then neither of them get the style. Only if I have them both on the same line does it work, and then only the 2nd element listed gets the style. If I swap text and password, then the text fields get it, but password fields don't.

What am I doing wrong?

OldRod wrote:Trying to stylize my user registration screen and have run into a problem.

In my style.css file I have this:

Code: Select all

#pageMiddle > #register > input[type=text], input[type=password] {
	border: 1px solid black;
	display: block;
	margin: 0 0 1em 0;
	background: #ADA593;
}

Then in my registration page, I have this:

Code: Select all

<div id="pageMiddle">
     <div id="register">
          <h4>Choose a Username:</h4>
          <input type="text" name="username" />
          <h4>Password:</h4>
          <input type="password" name="password" />
     </div>
</div>

What is happening is the password box gets the custom style, but the textbox does not. I tried styling each one individually (just do #pageMiddle > #register > input[type=text] and then neither of them get the style. Only if I have them both on the same line does it work, and then only the 2nd element listed gets the style. If I swap text and password, then the text fields get it, but password fields don't.

What am I doing wrong?

Strange, as I just put your code into an empty page and both get the custom style. Do you have other css or styles that conflict with them?

Maybe try something like:

Works for me as well.

Yeah, if I remove the #pageMiddle and #register div names, then it works, but this form is inside those divs and I wanted it styled differently than other forms on the site if I can

I will keep tinkering with it

OldRod wrote:Yeah, if I remove the #pageMiddle and #register div names, then it works, but this form is inside those divs and I wanted it styled differently than other forms on the site if I can

I will keep tinkering with it

Well, I've found out that CSS can be very touchy ! Hope you get it figured out soon. I also, as said before, took your code and plugged it into a blank file and it all worked. It formatted everything. So not sure! Thought maybe changing them individually might help and turning them into class.

I got it working. I just made a special div class "reginput" and used that for those input boxes

OldRod wrote:I got it working. I just made a special div class "reginput" and used that for those input boxes

Awesome! Glad you have it working