6 Replies Latest reply on May 8, 2006 6:47 AM by Newsgroup_User

    Form layout

    griffij76 Level 1
      Hi I have created a feedback form with dreemweaver and in that form I gave created a table for the necessary questions and text boxes. In the colums and rows with no cell spacing or padding. My problem is that on the design view it shows now gaps between the rows.

      In preiew view however it shows a a gap between each row. can anyone please help, the code is attach.

      THanks Joel
        • 1. Re: Form layout
          Level 7
          griffij76 wrote:

          > Hi I have created a feedback form with dreemweaver and in that form I gave
          > created a table for the necessary questions and text boxes. In the colums and
          > rows with no cell spacing or padding. My problem is that on the design view it
          > shows now gaps between the rows.
          >
          > In preiew view however it shows a a gap between each row. can anyone please
          > help, the code is attach.

          Add this to the styles at the top of the page.

          h3, h6 {
          margin: 0;
          padding: 0;
          }


          Like this


          <style type="text/css">
          <!--
          .style1 {font-family: Georgia, "Times New Roman", Times, serif}
          h3, h6 {
          margin: 0;
          padding: 0;
          }
          -->
          </style>

          • 2. Re: Form layout
            Level 7
            Osgood wrote:


            > Add this to the styles at the top of the page.
            >
            > h3, h6 {
            > margin: 0;
            > padding: 0;
            > }


            Actually Im not sure why you are using <h> (heading) tags in your form.
            I would be using plain old <p> tags to style the information and
            certainly not <h3>

            Im not sure you really want a search engine to thing that 'Mr' is that
            important in the context of your overall site information.

            • 3. Re: Form layout
              griffij76 Level 1
              Thanks Osgood

              Can I ask you one last question please? How do I change the size of the text box and it's text, or is it just a standard size?

              Thanks again Joel
              • 4. Re: Form layout
                inactiveforumnotifier Level 1
                Thanks Osgood

                Can I ask you one last question please? How do I change the size of the text box and it's text, or is it just a standard size?

                Thanks again Joel
                • 5. Re: Form layout
                  inactiveforumnotifier Level 1
                  Thanks Osgood

                  Can I ask you one last question please? How do I change the size of the text box and it's text, or is it just a standard size?

                  Thanks again Joel
                  • 6. Re: Form layout
                    Level 7
                    griffij76 wrote:

                    > Thanks Osgood
                    >
                    > Can I ask you one last question please? How do I change the size of the text box and it's text, or is it just a standard size?
                    >
                    > Thanks again Joel


                    As long as the text input fields have an id (#) which most of then do
                    except the mobile number then you can add those ids to the styles in the
                    head of the page and style them how you want

                    Be aware there are variations cross browser. Browsers render some of the
                    css in different ways.

                    You wont see some of the changes in Dreamweavers design view but they
                    will become apparent when you run the form via a browser


                    Like this.


                    <style type="text/css">
                    <!--
                    .style1 {font-family: Georgia, "Times New Roman", Times, serif}

                    #firstname, #propertyname, #address, #town, #city, #county, #postcode,
                    #telephone, #mobile, #email {
                    width: 150px;
                    height: 12px;
                    font-size: 11px;
                    color: #6600CC;
                    background-color: #FFCCFF;
                    }
                    textarea {
                    width: 150px;
                    font-size: 11px;
                    color: #6600CC;
                    background-color: #FFCCFF;
                    }
                    -->
                    </style>