Displaying form elements in a block

CJM

I'm adding some extra features to an intranet-based ASP application...

As part of the process, I thought I would give the html a mid-life upgrade,
ie. remove much of the tag-soup, replace with CSS and validate.
I'm not introducing full CSS-P at this stage, but where I can I'm trying
make inprovements.

The page uses a 3 frame layout. The left frame contains a form with a
textbox and a number of buttons (<input type="button">) .
[No, I wish it didn't use frames either - but short of re-writing the whole
app, I have no choice]

Rather than bind the form in a table, I'm trying to use CSS-P determine the
layout. I've tried using display:block at various points but cant get the
results I want. [the elements just dont seem to react!]

So how do I get the following to display as a vertical list of elements?

<body>
<form>
<input type="button">
<input type="text">
<input type="button">
<input type="button">
</form>
</body>

Apologies for the pseudo-code - I'm still working on getting the 'real' code
to validate, and I didn't want to cloud the issue.

Thanks

Chris

Jul 20 '05 #1

Subscribe Reply

2674

William Tasso

CJM wrote:

...
Rather than bind the form in a table, I'm trying to use CSS-P
...
So how do I get the following to display as a vertical list of
elements?

<body>
<form>
<input type="button">
<input type="text">
<input type="button">
<input type="button">
</form>
</body>
does this help? http://www.williamtasso.com/contact.asp
Apologies for the pseudo-code - I'm still working on getting the
'real' code to validate, and I didn't want to cloud the issue.

ahem: now don't start ;o)

--
William Tasso - http://WilliamTasso.com

Jul 20 '05 #2

CJM

> does this help? http://www.williamtasso.com/contact.asp

Er... not as much as I would like! I'm almost certainly missing a simple but
fundamental point. It's probably a typo somewhere.

I tried to create a cut-down page to demonstrate, but unfortunately I can't
upload it anywhere - a colleague has blocked all ftp traffic!
So instead, I've attached the cut-down code.

Apologies for the pseudo-code - I'm still working on getting the
'real' code to validate, and I didn't want to cloud the issue.

ahem: now don't start ;o)

Hey! Just trying to avoid the usual to-ing and fro-ing! Stop stirring, you
awkward b*gger! lol

Actually, it validates now, courtesy of c.i.w.a.h.

PS. I don't care much for your colour scheme, but I like your logo. Very
topical! Not sure our antipodean friends would approve! lol

Cheers

Chris

>>>>>>>>>>> >>>>>>>>>>>>

Code Snippet:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<title>SND: Options</title>
<STYLE TYPE="text/css">

</STYLE>
</head>
<body>
<form method="post" id="frmOptions " name="frmOption s" action=""
target="content ">
<div id="options">
<input class="btn" onclick="" type="button" value="Home" title="Back to
Homepage" id="Home" name="Home"></span>
<input type="text" id="SerialNo" name="SerialNo" size="9" onkeypress=""
<input size="" type="submit" id="ViewSN" value="View" name="ViewSN"
onclick='' class="btn" title="View Serial No">
<input onclick='' class="btn" type="submit" id="AddEdit"
value="Add/Edit" name="AddEdit" title="Add or Edit Serial No">
<input onclick='' class="btn" type="submit" id="Transfer"
value="Transfer " name="Transfer" title="Transfer Serial No">
<input onclick='' class="btn" type="submit" id="Invoice" value="Invoice"
name="Invoice" title="Invoice Serial No">
<input onclick='' class="btn_sml" type="submit" id="ChPwd" value="Change
Pwd" name="ChPwd" title="Change Password">
<input onclick='' class="btn_sml" type="submit" value="Logout"
name="Logout" title="Logout" id="Logout">
</div>
</form>
</body>
</html>

Jul 20 '05 #3

William Tasso

CJM wrote:

does this help? http://www.williamtasso.com/contact.asp

Er... not as much as I would like! I'm almost certainly missing a
simple but fundamental point. It's probably a typo somewhere.

each input element needs to be (or better contained in) a block level
element to get the effect you want.
...
PS. I don't care much for your colour scheme,
<sulk mode="frankenfu rter">I didn't build it for you</sulk>
but I like your logo.
Very topical! Not sure our antipodean friends would approve! lol

he heh - glad to be of service

--
William Tasso - http://WilliamTasso.com

Jul 20 '05 #4

Similar topics

1468

Is it just 'bad form'?

by: DFN-CIS NetNews Service | last post by:

I don't seem to see the following structure very often ... <root> <e1>this <e2/> <e3>that</e3> </e1> </root> That is an element with text /and/ child nodes.

.NET Framework

3091

Vocabulary Practice Application - Forms, Arrays, Cookies?

by: Citoyen du Monde | last post by:

Trying to get some ideas on a simple javascript project (to teach myself the language). I want to develop a client-side vocabulary practice application that would allow users to enter their own words, their own definitions plus an example of how the word is used in practice. It'll be all client side with - cookies? to get persistence so that the words won't disappear on me each time the page is closed (which is what happened when I

Javascript

12619

INPUT element not allowed in form, can't find my error

by: Stan Brown | last post by:

http://oakroadsystems.com/nonce/zonk.htm (12 lines) > http://validator.w3.org/check?charset=%28detect+automatically%29&doctype=Inline&uri=http%3A%2F%2Foakroadsystems.com%2Fnonce%2Fzonk.htm&outline=x The W3C validator says "INPUT is not allowed here". I'm sure my mistake is really obvious, but I just can't see it. I'd appreciate another pair of eyes pointing out the problem. For convenience, here's the entire file. I've stripped it...

HTML / CSS

2447

keep form elements enabled on "back" request

by: Dani | last post by:

Hello everybody, I have some code that disables form elements on body load, but I notice when I hit the "back" button, I need to re-enable the form elements (that is done by clicking on a radial button). Is there any way I can keep the form for disabling every time a user hits the back button and "remember" what elements should be enabled? I was thinking maybe utilizing some referrer thing, but I'm not that good with JS yet. Thanks...

Javascript

5557

Displaying code with <pre>

by: Eric Lindsay | last post by:

I can't figure how to best display little snippets of shell script using <pre>. I just got around to organising to bulk validate some of my web pages, and one of the problems occurs with Bash shell pieces like this: <pre><code> #!/bin/sh ftp -i -n ftp.server.com< <EOF user username password epsv4 cd /

HTML / CSS

2596

Reading a Delimited File & Displaying Specific Output on Web Page

by: j7.henry | last post by:

I am trying to pull specific data that is in a comma delimited file into a web page. So if my comma delimited file looks like: Name,Address,Zip Fred,123 Elm,66666 Mike,23 Jump,11111 I would like to be able to read this data and put each row into a variable? so I could display the values in a web page where I want.

Javascript

2483

display:block on form elements

by: Dave | last post by:

Hello. In trying to get an anchor element to stylistically match an input or button element, I find that the button and input cannot be styled according to the 2.1 CSS spec. For example, I expected this ruleset: ..but { display: block; background-color: red; font-size: 14px; text-decoration: none; line-height: 16px; width: auto; height: 16px; padding: 0; margin: 0;

HTML / CSS

3004

form validation design setup

by: Rik | last post by:

Hello guys, now that I'm that I'm working on my first major 'open' forms (with uncontrolled users I mean, not a secure backend-interface), I'd like to add a lot of possibilities to check wether certain fields match certain criteria, and inform the user in different ways when the data is wrong (offcourse, this will be checked on posting the data again, but that's something I've got a lot of experience with). Now, offcourse it's...

Javascript

4229

IE6 not displaying text correctly - IE 7 & Firefox 3 are fine!

by: littlealex | last post by:

IE6 not displaying text correctly - IE 7 & Firefox 3 are fine! Need some help with this as fairly new to CSS! In IE6 the text for the following page doesn't display properly - rather than being aligned to the top, along with the slideshow and link buttons, you have to scroll down to see the text - how can I make IE6 display correctly? http://geekarama.co.uk/new_home.html here is the code for new_home.html and following that the CSS...

HTML / CSS

9711

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

9593

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

10595

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

10335

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

9169

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...

Career Advice

7633

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

6862

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...

C# / C Sharp

4306

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

3831

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP