Tables positioning - HTML / CSS

30 New Member

I have been trying to make some very basic forms. Everything I think should work once I get it on my server, but it looks like crap. I know you are supposed to use tables for an easy way to position. I know really nothing about tables. I just sort of guessed on what to do this is what I came up with.

Expand|Select|Wrap|Line Numbers

 
<?php

include('includes/corefuncs.php');

if (function_exists('nukeMagicQuotes')) {

   nukeMagicQuotes();

   }
 
/////////////////////////////////////////////////
 
//go ahead only if not suspect and all required fields OK

if (!$suspect && empty($missing)) {

     //set defaul values for variables that might not exist

     $quote = isset($quote) ? $subscribe : 'Nothing Selected';

}

///////////////////////////////////////////////////////////
 
$subject = 'Project Idea';
 
//list expected feilds

   $expected = array('name', 'email', 'comments', 'budget', 'quote');

//set required fields

   $required = array('name', 'comments', 'email');

//creat an empty array for any missing fields

$missing = array();
 
///////////////////////////////////////////////////////////
 
//process email

if (array_key_exists('send', $_POST)) {

   $to = 'goldfishgraphics@gmail.com'; //my email

   $subject = 'Project Idea';
 
//create empty array for any missing fields

$missing = array();

//assume that there is nothing suspect

$suspect = false;

//create a pattern to locate suspect phrases

$pattern = '/Content-Type:|Bcc:|Cc:/i';
 
//function to check for suspect phrases

function isSuspect($val, $pattern, &$suspect) {

     // if the variable is an array, loop through each element

     // and pass it recursively back to the same function

     if (is_array($val)) {

         foreach ($val as $item) {

             isSuspect($item, $pattern, $suspect);

         }

     }

     else {

         // if one of the suspect phrases is found, set Boolean to tur

         if (preg_match($pattern, $val)) {

             $suspect = true;

         }

     }

}
 
// check the $_POST array and any subarrays for suspect content

isSuspect($_POST, $pattern, $suspect);
 
if ($suspect) {

     $mailSent = false;

     unset($missing);

}

else {
 
//process the $_POST variables

foreach ($_POST as $key => $value) {

     //asign to temporary variable and strip whitespace if not an array

$temp = is_array($value) ? $value : trim($value);

     //if empty and required, add to $missing array

     if (empty($temp) && in_array($key, $required)) {

         array_push($missing, $key);

     }

     //otherwise, assign to a variable of the same name as $key

     elseif (in_array($key, $expected)) {

         ${$key} = $temp;

     }

}

}

//build the message
 
//go ahead if required feilds are in

if (!$suspect && empty($missing)) {
 
//build message

   $message = "Name: $name\n\n";

   $message .= "Email: $email\n\n";

   $message = "Budget: $budget\n\n";

   $message = "Quote: $quote\n\n";

   $message .= "Comments: $comments";
 
//limit line length to 65 characters

   $message = wordwrap($message, 65);
 
// send it

$mailSent = mail($to, $subject, $message);

if ($mailsent) {

   //missing is no longer needed if the meail is sent, so unset it

   unset($missing);

     }

      }

     }
 
?>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtmll/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
 
<head>
 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
 
<title>Goldfish Graphics</title>
 
<link type="text/css" rel="stylesheet" href="Goldfish.css" />
 
<style type="text/css">

<!--

A {text-decoration:none}

-->

</style>
 
</head>

<body>
 
<div id="container">
 
<div id="banner">

<img src="images/banner.jpg" alt= "Goldfish Graphics Banner Image" />

</div>
 
<div id="navigation">

<div id="hvan">

<a href="index.php">Home</a> &nbsp; &nbsp; &nbsp; &nbsp;  <a href="services.php">Services</a> &nbsp; &nbsp; &nbsp; &nbsp;  <a href="portfolio.php">Portfolio</a> &nbsp; &nbsp; &nbsp; &nbsp; <a href="contact.php">Contact</a>

</div>

</div>
 
<div id="sidebar">
 
<div id="texto">
 
<h4 class="sidebar"> Testimonies</h4>

<p>

<?php include('testmonies.php'); ?>
 
</p>
 
</div>

<h4>Links</h4>
 
<div id="links">
 
<div class="nav">

<p>

<?php

@include('includes/links.html');

?>
 
</p>

</div>
 
</div>

</div>
 
<div id="content">

<div id="text">

<h2>Contact</h2>

<p id="home">
 
<form id="feedback" method="post" action="">
 
<table>

<tr>

<td>

     <label for="name">Name:</label>

     <input name="name" id="name" type="text" class="formbox"

     <?php if (isset($missing)) {

       echo 'value="'.htmlentities($_POST['name']).'"';

     } ?>/> *
 
</td>

<td>
 
     <label for="budget">Budget:</label>

     <input name="budget" id="budget" type="text" class="formbox"

     <?php if (isset($missing)) {

       echo 'value="'.htmlentities($_POST['budget']).'"';

     } ?>/>
 
</td>    

   </tr>    
 
   <tr>

   <td>

       <label for="email">Email:</label>

     <input name="email" id="email" type="text" class="formbox"

     <?php if (isset($missing)) {

       echo 'value="'.htmlentities($_POST['email']).'"';

     } ?>/> *

   </td>
 
   <td>

   Free quote?

   <input name="quote" type="radio" value="Yes" id="Free Quote"

   <?php

   $OK = isset($_POST['quote']) ? true : false;

   if ($OK && isset($missing) && $_POST['quote'] == 'Yes') { ?>

       checked="checked"

   <?php } ?>

   />

   <label for="quote-yes">Yes</label>

   <input name="quote" type="radio" value="No" id="subscribe-no"

   <?php

   if ($OK && isset($missing) && $_POST['quote'] == 'No') { ?>

       checked="checked"

   <?php } ?>

   />
 
   <label for="quote-no">No</label>
 
   </td>

</tr>
 
   <tr>

   <td>

     <label for="comments">Prodject Description: *</label>

     <textarea name="comments" id="comments" cols="54" rows="5"><?php

     if (isset($missing)) {

         echo htmlentities($_POST['comments']);

     } ?></textarea>

     </td>

     <td>

     </td>

   </tr>
 
   <tr>

   <td>

     <input name="send" id="send" type="submit" value="Submit" />

   </td>

   <td>

   </td>

   </tr>
 
   </tabel>

</form>
 
<?php

if ($_POST && isset($missing)) {

?>

   <p class="warning">Please complete all required missing item(s).</p>

<?php

  }

elseif ($_POST && !$mailSent) {

?>

   <p class="warning">Sorry, there was a problem sending your message. Please try later.</p>

<?php

  }

elseif ($_POST && $mailSent) {

?>

   <p><strong>Your message has been sent. Thank you.

</strong></p>

<?php }?>
 
</p>
 
<p id="news">

If you have questions, comments, or troubles with the form above, you can also contact me at goldfishgraphics@gmail.com.

</p>

</div>

</div>
 
<div id="footer">

</div>
 
</div>
 
</body>

</html>

Now I have the forms and tables built correctly I think, but I have no Idea how to make them look good in terms of padding and stuff. I need help. Could someone help me please hear is what I have so far.

http://i93.photobucket .com/albums/l75/Bouz...uzy/contact.jpg

hear is what my layout looks like on all the rest of my pages...

http://i93.photobucket .com/albums/l75/Bouzy_Bouzy/IEGOLD.jpg
Notice where the footter is and stuff.

Hear is my CSS also if its needed.

Expand|Select|Wrap|Line Numbers

  
body {
 
background-color: #5f656b;

font-family: Tahoma, "Arial Unicode MS", Arial, sans-serif, serif;

font-size: .8em;

color: #eea103
 
}
 
/*July 8th 2007*/
 
#content {
 
height: 505px;

width: 518px;

background-image: url(images/content.jpg);

background-repeat: no-repeat;

margin-top: 4%;

margin-left: 27.2%;
 
}
 
#sidebar {
 
height: 505px;

width: 153px;

background-image: url(images/sidebar.jpg);

background-repeat: no-repeat;

margin-top: 4%;

padding-top: 3%;

padding-left: 3.5%;

margin-left: auto;

float: left;
 
}
 
#linkscss {
 
padding-left: .8%;

padding-right: .8%;

padding-top: 4%;

width: 105px;
 
}
 
#navigation {
 
margin: 0%;

padding-top: 0%;

border-width: 0px;

height: 28px;
 
}
 
#banner {
 
border-width: 0px;

margin: 0%;

padding: 0%;

margin-top: 0%;

height: 119px;
 
}
 
#footer {
 
height: 28px;

width: 712px;

background-image: url(images/footer.jpg);

background-repeat: no-repeat;

margin-top: 4.2%;
 
}
 
#container {
 
width: 712px;

margin: auto;

position: relative;

padding: 0%;

background-color: #3c4246;
 
}
 
#home {
 
width: 442px;
 
}
 
#news {
 
width: 442px;
 
}
 
#texto {
 
padding-left: .8%;

padding-right: .8%;

padding-top: 6%;

width: 105px;
 
}
 
#text {
 
padding-left: 5.5%;

padding-top: 5%;

padding-right: 5.5%;
 
}
 
#footer {
 
padding-top: .01%;

padding-left: 3%;

font-size: .7em;

}
 
#links {
 
padding: 0%;

margin: 0%;
 
}
 
#navigation {
 
height: 28px;

width: 712px;

background-image: url(images/navigation.jpg);

background-repeat: no-repeat;

margin-top: 0%;
 
}
 
#hvan {
 
margin-left: 28.5%;

padding-top: .7%;

padding-bottom: 1%;
 
}
 
h4.sidebar {

margin: 0px;

padding: 0px;

padding-top: 15%;

}
 
/*Should change form colors*/
 
#quotel {
 
}
 
.quote {
 
}
 
.name {

font-size: 14px;

background-color: #575b64;

border: 1px solid #eea103;

color: #eea103;
 
}
 
.budget {

font-size: 14px;

background-color: #575b64;

border: 1px solid #eea103;

color: #eea103;
 
}
 
.email {

font-size: 14px;

background-color: #575b64;

border: 1px solid #eea103;

color: #eea103;
 
}
 
textarea {

background-color: #575b64;

border: 1px solid #eea103;

color: #eea103;
 
}
 
input {

background-color: #575b64;

border: 1px solid #eea103;

color: #eea103

}
 
a:link {

color: #ef9f02;
 
}
 
a:visited {

color: #ef9f02;

}
 
a:hover {

color: #ae6d1b;
 
}
 
a:active {

color: #ef9f02;
 
}
 
table {

  margin-left: 0px;

  margin-right: 30px;

}
 
td, th {

padding: 0px;

margin: 0px;

}
 
.nav a {
 
color: #ef9f02;

text-decoration: none;
 
}
 
.nav a:visited {

color: #ef9f02;

text-decoration: none;
 
}
 
.nav a:hover {
 
color: #ae6d1b;

text-decoration: underline;
 
}
 
.nav a:active {
 
color: #ef9f02;
 
}

Aug 5 '07 #1

Subscribe Reply

1486

drhowarddrfine

7,435

Recognized Expert Expert

I know you are supposed to use tables for an easy way to position.

Absolutely not! Never use tables for layout. In fact, tables for layout is stupid.

I know little about PHP but I'll be looking through this for a while.

Aug 5 '07 #2

drhowarddrfine

7,435

Recognized Expert Expert

</table> mis-spelled.
You have Free and Quote listed as id names but id can only be one name.

This is what validating is for. It shows 24 html errors but your CSS is ok. Fix those errors and then we can work on positioning.

Aug 5 '07 #3

Similar topics

2707

CSS Tables not practical?

by: Mason A. Clark | last post by:

CSS Experts: OK, I'm a stupid newby. Now, here's the question: Can CSS replace slightly complicated Tables and work in three browsers (e.g. MSIE 6.0, Net 7.1, Op 7.03) ? After countless attempts I've concluded "no". Thank you,

HTML / CSS

5159

CSS versus HTML tables

by: sinister | last post by:

I wanted to spiff up my overly spartan homepage, and started using some CSS templates I found on a couple of weblogs. It looks fine in my browser (IE 6.0), but it doesn't print right. I tested the blogs, and one definitely didn't print right. Surveying the web, my impression is that CSS is very unreliable, because even updated browsers fail to implement the standards correctly. So should one just avoid CSS? Or is it OK if used...

HTML / CSS

7223

Thumbnail gallery without tables?

by: Max Quordlepleen | last post by:

Apologies for the crossposting, I wasn't sure which of these groups to ask this in. I have been lurking in these groups for a week or so, trying to glean what I need to design a simple, clean set of pages that get the w3c tick for XHTML 1.0 Strict, and CSS2. So far, I have succeeded, thanks to the great information in these groups. Now, however, I'm having trouble. A few days ago, I read a thread that dealt with this issue of...

HTML / CSS

1893

Coordinates of divs and tables without absolute positioning?

by: Siegfried Heintze | last post by:

I want to implement drag and drop for tables, divs, spans. The problem is that I don't know how wide or long my tables, divs and spans are going to be in advance so I cannot use absolute coordinates. (It always seemed odd to me that there is no function called GetExtent that would return the bounding rectangle of an object -- this would solve my problem). There is a way, however, to fetch the coordinates of an object (such as a table, or...

Javascript

1879

Positioning HTML tables

by: aljamala | last post by:

Hi, I have a group of 5 tables laid out of the web page. 2 go on the left side and 3 on the right. These tables retrieve data from the database so the number of records (rows) returned varies. So the problem I am having at the moment is that if the table gets longer by one or two rows, all my alignment goes of out whack for the other tables. Is there a way for example to place table #2 right after table#1 ends?

HTML / CSS

6529

HTML Tables vs. CSS Layers - when function and form coincide

by: www.gerardvignes.com | last post by:

I was checking out a website offered as an example for another job, and I was struck by how clean and professional the site is. http://www.colorlines.com/ I was poking around, and I noticed that they are still using HTML Tables for content. I realize that many sites still use HTML Tables for their content, but it is generally discouraged in favor of CSS Layers.

HTML / CSS

1890

Beginner converting from tables -- probably very simple answer

by: Rangy | last post by:

Hi, I've decided to take the plunge and move from tables to a pure css layout. I still "think" in tables when I do my layouts and I was wondering the following: I have a simple, standard two column layout: header nav content

HTML / CSS

1511

Layout: Divs or Tables?

by: =?Utf-8?B?Tkg=?= | last post by:

Hi, What do you recommend for defining the layout of an asp.net 2.0 page? Leaving masterpages and user controls aside for the moment is the use of tables or Divs the best approach? I have been using tables so far to define the layout and use % based sizes so things stretch or shrink to fit the screen size. It works fine. I read about using DIVs and saw this approach being used in some MS Asp.net

ASP.NET

1953

Dynamically Creating repeating tables with ASP and CSS

by: marijuanated | last post by:

Hi All, I am generating a series of tables in CSS. The tables should repeat themselves for a number of times governed by a counter that is calculated at runtime by the ASP code. The problem is that I have used top margins to position the tables in the ASP page. So the tables when repeated super-impose on the tables that are already placed at that margin position. Can someone suggest me a better way out to resolve this?

ASP / Active Server Pages

4119

No TABLES in html. No hacks in CSS. Any layout possible, crossbrowser. Try it.

by: brave1979 | last post by:

Please check out my javascript library that allows you to create any layout for your web page, nested as deep as you like, adjusting to width and height of a browser window. You just describe it in javascript object and that's all. No need to know CSS hacks, no need to clutter your html with tables. http://www.bravelayout.scarabeo.biz/Quickstart

HTML / CSS

8674

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

9157

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++

7725

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

6518

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

5860

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

4369

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

4619

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

3046

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

2001

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General