Member Avatar for lewashby

I'M trying to make the following web page fluid, or liquid. I want the page and form to resize as the browser is resized. Any idea on how I can accomplish this? Thanks.

<html>
<head>
<title>Test</title>
</head>

<body>
<link rel="stylesheet" type="text/css" href="mystyles.css" media="screen" />

<form action="bail.php" method="POST">

<div id="page">
<table width="25%">

<tr> <td>First Name:</td> 
     <td align="right"> <input type="text" name="fname"></td></tr>

<tr> <td>Last Name:</td>
     <td align="right"> <input type="text" name="lname"></td></tr>

<tr> <td>Address:</td>
     <td align="right"> <input type="text" name="address"</td></tr>

<tr> <td>City:</td>
     <td align="right"> <input type="text" name="city"</td></tr>

<tr> <td>Zip code:</td>
     <td align="right"> <input name="zip"></td></tr>

<tr> <td>Sate: <select name="sate">

    <option value="NONE"> Select</option>
    <option value="AL"> AL - Alabama</option>
    <option value="AK"> AK - Alaska</option>
    <option value="AZ"> AZ - Arizona</option>
    <option value="AR"> AR - Arkansas</option>
    <option value="CA"> CA - Califonria</option>
    <option value="CO"> CO - Colorado</option>
    <option value="CT"> CT - Connecticut</option>
    <option value="DE"> DE - Delaware</option>
    <option value="FL"> FL - Florida</option>
    <option value="GA"> GA - Georgia</option>
    <option value="HI"> HI - Hawaii</option>
    <option value="ID"> ID - Idaho</option>
    <option value="IL"> IL - Illinois</option>
    <option value="IN"> IN - Indiana</option>
    <option value="IA"> IA - Iowa</option>
    <option value="KS"> KS - Kansas</option>
    <option value="KY"> KY - Kentucky</option>
    <option value="LA"> LA - Louisiana</option>
    <option value="ME"> ME - Maine</option>
    <option value="MD"> MD - Maryland</option>
    <option value="MA"> MA - Massachusetts</option>
    <option value="MI"> MI - Michigan</option>
    <option value="MN"> MN - Minnesota</option>
    <option value="MS"> MS - Mississippi</option>
    <option value="MO"> MO - Missouri</option>
    <option value="MT"> MT - Montana</option>
    <option value="NE"> NE - Nebraska</option>
    <option value="NV"> NV - Nevada</option>
    <option value="NH"> NH - New Hampshire</option>
    <option value="NJ"> NJ - New Jersey</option>
    <option value="NM"> NM - New Mexico</option>
    <option value="NY"> NY - New York</option>
    <option value="NC"> NC - North Carolina</option>
    <option value="ND"> ND - North Dakota</option>
    <option value="OH"> OH - Ohio</option>
    <option value="OK"> OK - Oklahoma</option>
    <option value="OR"> OR - Oregon</option>
    <option value="PA"> PA - Pennsylvania</option>
    <option value="RI"> RI - Rhode Island</option>
    <option value="SC"> SC - South Carolina</option>
    <option value="SD"> SD - South Dakota</option>
    <option value="TN"> TN - Tennessee</option>
    <option value="TX"> TX - Texas</option>
    <option value="UT"> UT - Utah</option>
    <option value="VT"> VT - Vermont</option>
    <option value="VA"> VA - Virginia</option>
    <option value="WA"> WA - Washington</option>
    <option value="WV"> WV - West Virginia</option>
    <option value="WI"> WI - Wisconsin</option>
    <option value="WY"> WY - Wyoming</option>
    </select></td><td><input type="submit"></td></tr>
</form>
</table>
</div>
</body>
</html>
  • 3 Contributors
  • 2 Replies
  • 117 Views
  • 4 Hours Discussion Span
  • Latest Post Latest Post by LastMitch
Member Avatar for <M/>

Have you read this:
http://www.htmlbasictutor.ca/flexible-liquid-design.htm

http://css-tricks.com/the-perfect-fluid-width-layout/

http://www.maxdesign.com.au/articles/liquid/

http://wildreason.com/wildreason-blog/2010/how-to-create-a-fluid-width-2-column-css-layout/

You can google for more solutions.

I noticed that a lot of people like to adjust the widths (as an example) with percentages rather than just pixels. With the percentages, you can adjust the page (as an example) 80% of the window rather than pixels. I don't don't know if I make much sense but the links may help out a bit.

Member Avatar for LastMitch

I'M trying to make the following web page fluid, or liquid. I want the page and form to resize as the browser is resized. Any idea on how I can accomplish this? Thanks.

Are you familiar with CSS?

I don't see any CSS code I only see HTML code.

I hope you don't expect someone to write it for you?

You can take a look at the articles/tutorial that <M/> provided.

It has those CSS code that you need for your website.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.