Slight login problem

[Ztyle]

Hey guys, I've added a login Module on my joomla website and I'm having a problem with the .inputbox section. I've looked all over the net for a solution but cant seem to find one. Basically as I understand it:

if the background is 'White' (background: White

Then I get the white colour in the blank fields you put your details in. However, I also get a small white box around the radio button you check to
'Remember me' at about the thickness of 3px. This does not happen in Firefox, Just internet explorer 7.

Now, If I change the background colour to 'Transparent' the box around the check button disappears. However the white in the blank fields also disappears (which I want to keep.)

So, here is the question: How do I separate the two so I can control this Anomaly?

[admin]

The only thing I could tell is not much.
You would have to edit the login module by hand then add so custom css class or ID to module. input class in Joomla is very generic and is used all over in any form.

As for the IE issue ?

Cheers,
Brian

[Ztyle]

Okay, I'm coming back top this topic a few weeks after my original post. The learning curve for Open Source is steep and I’m a lot more competent with code at this point. However this a problem I had as a beginner and I’m here now to offer a solution for you.

There are Two main points to address.

The first Point:
When you originally set up your login module if you look at it in Firefox and Internet Explorer it looks completely different. The input boxes in Firefox are nice and sleek but in Internet explorer they are quite large and with thick boarders. This is fair enough I suppose, except it can knock out some of the accuracy when designing your Joomla Template and prevent one from looking as good as the other. Being a perfectionist as a designer I hate having this kind of discrepancy and want them to be both viewed as similar as possible.

* (Remember not designing your template for both browsers in mind is a big mistake ! It used to be that most people used Internet Explorer for their web surfing, but these days Firefox does have a large fan base which is growing constantly.)

The second Point:
With your CSS template file by default there is white boarder around the check box that is utterly distasteful unless your background happens to be white. This can seriously spoil and limit your Template designs as far as using a background colour or gradient is concerned.

To fix both these problems simply adjust the specified code as follows:

Orignaly you will have:

input {
font-family: Arial, Verdana, Helvetica, sans-serif;
background-color:#FFFFFF; font-size: 13px; color: #333;
}
.inputbox {background: White;}

Replace them with:

input {
font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 13px;
}
.inputbox {border-top-width: 1px;
border-top-style: solid;
border-top-color: #999999;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #dddddd;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #dddddd;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #999999;
font-family: Arial, Verdana, Helvetica, sans-serif;
}

This will get rid of the white boarder around the check box and give Internet Explorer some actual directions as to how its input box should look so it matches the Firefox default.

Hope this helps guys

Regards, Michael