The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Form? Large space between my label and text field, Form? Large space between my label and text field
ACF
post Feb 22 2008, 01:01 AM
Post #1


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



http://www.zaworks.com/contactinformation.html

I don't know what touched to make this happen. I am using css, it wasn't like this still i started working on the other pages. I may have changed something that didn't need to be changed in the css but i can't seem to find what i did. Please help im really frustrated. Check out the link above and ill copy past the css below.

Any help would be great thanks.

CODE

@charset "UTF-8";
fieldset {
margin-top: 0px;
margin-right: 0px;
margin-bottom: 1em;
margin-left: 0px;
width: 550px;
background-color: #999999;
padding: 3em;
}
fieldset ol {
margin: 0em;
list-style-type: none;
line-height: normal;
width: 550px;
top: 0px;
padding-top: 0em;
padding-right: 3em;
padding-bottom: 0em;
padding-left: 3em;
}
#wrapper {
float: none;
height: 1010px;
width: 900px;
position: relative;
margin-right: auto;
margin-left: auto;
margin-bottom: auto;
background-color: #999999;
background-attachment: fixed;
background-image: url(Images2/bg1.gif);
background-repeat: no-repeat;
background-position: center center;
padding-left: 5em;
}
#wrapper2 {
background-attachment: fixed;
background-image: url(Images2/bg1.gif);
background-repeat: no-repeat;
background-position: center center;
margin-top: 2em;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
float: none;
height: 600px;
width: 800px;
}
#flash {
background-position: center center;
float: none;
height: 700px;
width: 800px;
padding: 1px;
margin-top: -20px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#thankyou {
background-attachment: fixed;
background-image: url(Images2/thankyou3.gif);
background-repeat: no-repeat;
background-position: center center;
height: 800px;
}
label {
text-align: right;
float: left;
width: 6em;
padding-right: .5em;
}
.options label {
text-align: left;
float: none;
width: auto;
}
.overall {
width: 500px;
float: none;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
height: 500px;
text-align: center;
padding: 5em;
}
.legend {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 20px;
font-style: normal;
line-height: normal;
font-weight: normal;
color: #990000;
}
.explanatory label {
text-align: left;
display: block;
float: none;
width: 15em;
margin: 0em;
height: 2em;
line-height: 23px;
top: 0px;
background-position: 0em;
padding-top: 0em;
padding-right: 1em;
padding-bottom: 0em;
padding-left: 1em;
}
.buttons {
left: 0px;
top: 0em;
right: 0em;
bottom: 0px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
padding: 0em;
margin-top: 1px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
text-align: center;
}
.textfield {
background-color: #FFFFFF;
border: 1px solid #000033;
width: 12em;
}
.textfield2 {
width: 20em;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
padding: 1px;
top: 1em;
margin-top: 1em;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
.textfield3 {
width: 20em;
background-color: #FFFFFF;
margin: 1em;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: 0;
border-right-style: 0;
border-bottom-style: 0;
border-left-style: 0;
padding-top: 1em;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
#htmlpage {
background-repeat: no-repeat;
background-position: center center;
height: 900px;
width: auto;
background-attachment: fixed;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bolder;
color: #FF0000;
background-image: url(Images2/Classifiedsad4.gif);
}
#footer {
color: #FF0000;
margin-top: 0em;
font-weight: bold;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-repeat: no-repeat;
font-size: 14px;
padding-top: 50em;
padding-right: 0;
top: 0em;
height: auto;
width: auto;
text-align: center;
vertical-align: top;
}
footertest2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 36px;
color: #FF0000;
padding-bottom: 0em;
text-align: center;
vertical-align: top;
top: 50em;
left: 10em;
padding-top: 100em;
}
#footer p {
margin: 0;
padding: 0;
height: auto;
}
}
.clear {
clear: both;
}
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Feb 22 2008, 01:08 AM
Post #2


WDG Member
********

Group: Root Admin
Posts: 8,316
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



I recommend that you start by fixing the markup errors and CSS errors reported by the online tools.

So, what is it about the current version that you don't like?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ACF
post Feb 22 2008, 11:49 AM
Post #3


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



alright ill look into what you said. the space between the label and the text field got large for some reason. If you try the form out the space will then jump closer to the label.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ACF
post Feb 22 2008, 11:51 AM
Post #4


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



oh man looks like i have a lot to fix
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ACF
post Feb 22 2008, 12:01 PM
Post #5


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



whats it mean when it says

Error: there is no attribute TYPE for this element (in this HTML version)

I built this in Dreamweaver cs3
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Feb 22 2008, 12:12 PM
Post #6


WDG Member
********

Group: Root Admin
Posts: 8,316
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



BTW, I hope this isn't a formmail script that can be abused as a spam gateway.

The space looks like a side effect of using "text-align : center". The label elements are floated left, and everything else (including the input elements) is centered.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Feb 22 2008, 12:15 PM
Post #7


WDG Member
********

Group: Root Admin
Posts: 8,316
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



QUOTE(ACF @ Feb 22 2008, 09:01 AM) *
whats it mean when it says

Error: there is no attribute TYPE for this element (in this HTML version)
Your doctype declaration claims that this is an XHTML document. (Is there a particular reason you're using XHTML rather than plain HTML?) Element names and attribute names are case sensitive in XHTML, and they must use lowercase letters. You used uppercase letters.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ACF
post Feb 22 2008, 12:22 PM
Post #8


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



oh, well no there wasn't a good reason for using XHTML. Im not sure how i did this. the name of the page has a .html. If you haven't noticed Im not to good at all this.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ACF
post Feb 22 2008, 12:25 PM
Post #9


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



I have the option in Dream weaver to convert the doc to html transitional or strict. Both are for 4.01. If I did this would or could it fix my problems? if so which one should i use?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Feb 22 2008, 12:47 PM
Post #10


WDG Member
********

Group: Root Admin
Posts: 8,316
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Please see the FAQ entry What is a DOCTYPE? Which one do I use?

Switching the doctype declaration from XHTML to HTML will fix the "Error: there is no attribute [...] for this element (in this HTML version)" and "Error: element [...] not defined in this HTML version" errors. But there are other errors too.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ACF
post Feb 22 2008, 01:03 PM
Post #11


Newbie
*

Group: Members
Posts: 15
Joined: 27-November 07
Member No.: 4,407



thanks you have been real helpful
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 14th October 2019 - 03:12 PM