12 replies [Last post]
Questor
Offline
newbie
Last seen: 14 years 16 weeks ago
Joined: 2007-01-17
Posts: 4
Points: 0

Firefox version is 1.5.0.9 ... The same code works in IE6 just fine.

What's happening is that the field_title class isn't of a set width. I want the input field spans to line up vertically, which obviously won't happen if the field_title spans are of variable length.

.h1 { font-family: Times New Roman; font-size: 16; font-weight: bold; } .login_box { text-align: left; max-width: 170px; /* for Mozilla */ width: 170px; /* for Microsoft */ }

.field_title {
text-align: left;
min-width: 70px; /* for Mozilla */
width: 70px; /* for Microsoft */
border: 2px solid #6374AB;
}

Ant

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 7 weeks 3 days ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Doctypes

Verschwindende wrote:
  • CSS doesn't make pies

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Was this more like what you

Was this more like what you wanted?

New document

html,body,p,div,img,h1,h2,h3,h4,li,ul,dl,dd,dt,form,table,td,tr{
/*** Let's go commando ***/
margin:0;
padding:0;
border:0;
border-collapse:0;
border-spacing:0;
}
input,select{
margin:0;
padding:0;
}
body{
font-family:verdana,arial,sans-serif;
font-size:100.1%; /*** Note: see http://www.thenoodleincident.com/ style the rest of font sizes in ems ***/
}
.clear{
clear:both;
/*** these next attributes are designed to keep the div
height to 1 pixel high, critical for Safari and Netscape 7 ***/
height:1px;
overflow:hidden;
line-height:1%;
font-size:0px;
}
/* \*/* html .clear{height:auto} /*** a fix for IE Win ***/
.login_box {
text-align: left;
max-width: 170px; /* for Mozilla */
width: 170px; /* for Microsoft */
margin-left:auto;
margin-right:auto;
}
.gr{margin:10px 0px;text-align:center}
.tf60{
margin:1px 0px 1px 0px;
float:right;
display:inline;
font-size:92%;
width:60px;
}
.login_box h2{
margin-bottom:5px;
font-size:80%;
text-align:center;
}
label{
display:inline;
}
label{
min-height:1.6em;
font-size:70%;
font-weight:normal;
display:block;
width:160px;
margin-bottom:5px;
}
label span{
float:left;
display:block;
margin-top:2px;
margin-bottom:2px;
width:85px;
text-align:left;
}
.registerclick{
font-size:80%;
text-align:center;
display:block;
}

Notice the doctype. No center used in the html, no breaks, and labels attached to the input boxes, the whole thing in a form.

Trevor

Questor
Offline
newbie
Last seen: 14 years 16 weeks ago
Joined: 2007-01-17
Posts: 4
Points: 0

That's going to take me a

That's going to take me a while to digest. It certainly fixed the issue. There's a lot here for me to learn from. I'll only ask though ...

Why go commando? lol.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 7 weeks 3 days ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Questor wrote:Why go

Questor wrote:
Why go commando? lol.

What do you mean?

Verschwindende wrote:
  • CSS doesn't make pies

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

thepineapplehead

thepineapplehead wrote:
Questor wrote:
Why go commando? lol.

What do you mean?

Seriously? You don't know what it means to go commando? Suggest a google. This link made me laugh:

www.wordspy.com/words/gocommando.asp

Trev

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

What he meant was I left a

What he meant was I left a joke comment in my css sample.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 7 weeks 3 days ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Oh, I knew what "going

Oh, I knew what "going commando" was, I just didn't realise he was referring to your CSS comment Tongue

Verschwindende wrote:
  • CSS doesn't make pies

Questor
Offline
newbie
Last seen: 14 years 16 weeks ago
Joined: 2007-01-17
Posts: 4
Points: 0

What I mean is - why set

What I mean is - why set everything to 0?

And also... Why define label twice?

label{ display:inline; } label{ min-height:1.6em; font-size:70%; font-weight:normal; display:block; width:160px; margin-bottom:5px; }

Sorry, though css is not new to me, this is the first I've interacted with other's on the subject. Previously I've been self taught. So I feel pretty much like a noob all over again.

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Set all these things to 0

Set all these things to 0 because each browser seems to set them differently by default, so this way you level the field and then build and set them as needed.

As to the double setting, can't remember. The code is from a page I did last year, and it fixed a bug with IE. Delete it and if it causes any problems, then you know the possible fix. The code was taken from huge form on a huge page, so it is unlikely to cause a problem by removing it!

Questor
Offline
newbie
Last seen: 14 years 16 weeks ago
Joined: 2007-01-17
Posts: 4
Points: 0

Well I've learned a lot.

Well I've learned a lot. Thank you!

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 27 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Questor wrote:Well I've

Questor wrote:
Well I've learned a lot. Thank you!

Ah so Grasshopper.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 7 weeks 3 days ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Questor wrote:So I feel

Questor wrote:
So I feel pretty much like a noob all over again.

Just remember, noob =/= newb.

You're a newbie - new to this. Noobs are people who are persistently stupid but do not improve or learn the right way to do things, and yet they're adamant what they know is right Laughing out loud

Verschwindende wrote:
  • CSS doesn't make pies