Jump to content

Why Is "body" All The Way To The Right?


Scotty13

Recommended Posts

<?php

include_once("scripts/checkuserlog.php");

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<meta name="Description" content="Airline Network" />

<meta name="Keywords" content="about, us, my, global, pnr, social, network, airline, employees, around, world, globe, global, my, global, PNR, social, network, about, reservations, locator, depart, ckin, announcing, announce, vacation, photos, dest, postcard, rent, home, blog, forum, books, travel, work, trip, reservation, book, exchange, organizer" />

<meta name="rating" content="General" />

<meta name="ROBOTS" content="All" />

<title>About Us at My Global PNR</title>

<link href="style/main.css" rel="stylesheet" type="text/css" />

<link rel="icon" href="favicon.ico" type="image/x-icon" />

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

<style type="text/css">

<!--

.boldtext {

font-weight: bold;

font-size: 36px;

}

body

{

background-image:url('images/bgaboutus.jpg'); background-position:center top;

background-repeat:no-repeat;

}

 

-->

</style>

</head>

 

<body>

<?php include_once 'mgpheader_template.php'; ?>

<table class="mainBodyTable" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td width="836" valign="top">

<div align="right">

<table width="100%" align="right" cellpadding="6">

<tr>

 

 

 

<td width="100%"><p align="left">Welcome Aboard,

<p align="left"> </p>

<p align="left">Won’t you take a few moments to make a reservation on the newest, most exciting new social network on the web? Enjoy the ease of navigating the site’s clever pages and share your love of the airline industry with other ticketed members? - Membership is free, so why not? </p>

</p>

 

<p align="left">We'll see you onboard,</p> </p>

<p align="left"> </p></td>

</tr>

</table>

</div></td>

<td width="160" valign="top"><?php include_once "right_AD_template.php"; ?></td>

</tr>

</table>

<?php include_once "footer_template.php"; ?>

</body>

</html>

Link to comment
Share on other sites

We need to see the CSS, too - that's what tells things where to go and how to look.

 

Also, you might want to read up on some SEO and keyword topics, words like 'us', 'my' (twice), about, etc, are pretty darn useless.

Link to comment
Share on other sites

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

text-align: center;

 

}

 

.centerStuff{

 

text-align: center;

background-image: center;

 

}

 

.footercenterlinks {

text-align: center;

}

 

.bluetext {

 

color: #00F;

 

}

 

.greentext {

 

color: #0C0;

 

}

 

.alignRt .brightRed .answerquestion {

color: #F00;

font-size: 24px;

 

}

 

#locationForm tr td strong {

 

color: #00F;

 

}

 

#websiteForm tr td strong {

 

color: #00F;

 

}

 

#youtubeForm tr td strong {

 

color: #00F;

 

}

 

#bioForm tr td strong {

 

color: #00F;

 

}

 

#locationForm tr td strong {

 

font-size: 18px;

 

}

 

#websiteForm tr td strong {

font-size: 18px;

text-align: center;

 

}

 

#youtubeForm tr td strong {

 

font-size: 18px;

 

}

 

#bioForm tr td strong {

 

font-size: 19px;

 

}

 

#bioForm tr td strong {

 

font-size: 20px;

 

}

 

#youtubeForm tr td strong {

 

font-size: 20px;

 

}

 

#youtubeForm tr td strong {

 

font-size: 18px;

 

}

 

#locationForm tr td strong {

 

font-size: 20px;

font-weight: bold;

 

}

 

.Edityourresdataherefont {

 

font-size: 20px;

 

}

 

.fonteditres {

 

font-size: 19px;

 

}

 

.bluefonteditres {

 

color: #00F;

font-weight: bold;

 

}

 

.boldfonteditres {

 

font-weight: bold;

 

}

 

.boldfonteditres {

 

font-weight: bold;

 

}

 

.boldfonteditred {

 

font-weight: bold;

color: #00F;

font-size: 16px;

 

}

 

.boldfonteditres {

 

font-weight: bold;

color: #00F;

 

}

 

.boldfonteditres {

 

font-weight: bold;

font-size: 18px;

text-align: left;

 

}

 

.alignRt .boldfonteditres {

 

font-size: 16px;

 

}

 

.totheright {

 

text-align: right;

 

}

 

.totheright strong {

 

color: #00F;

 

}

 

.formFields {

 

background-color:#FFFFFF;

color:#000;

 

}

 

.smallertext {

 

font-size: 16px;

 

}

 

.smaller {

 

font-size: 12px;

 

}

 

.alignleft {

 

text-align: left;

 

}

 

#last_posts {

font-size: 10px;

line-height: 1.5;

text-align: left;

border: 1px solid black;

}

 

/* -------------------- What the entire dropdown backround will look like and its positioning ---------------------- */

 

ul {

 

margin:0;

padding:0;

 

}

 

.dc{

 

display:inline;

position: relative;

z-index: 0;

margin:0;

padding:0;

text-align:center;

}

 

.dc:hover{

 

background-color: transparent;

z-index: 50;

 

}

 

.dc ul{

 

position: absolute;

width:120px;

background-color: #999;

left: -1000px;

list-style-type:none;

visibility: hidden;

 

}

 

.dc:hover ul{

 

visibility: visible;

top: 13px;

left:-5px;

 

}

 

/* -------------------- What the list items will look like inside the dropdown ---------------------- */

 

.dc ul li{

 

margin:0;

padding:0;

background-color: #EBEBEB;

margin:1px;

 

}

 

.dc ul li:hover {

 

background-color: #FFF;

margin:1px;

 

}

 

/* -------------------- What the links look like inside the dropdown ---------------------- */

 

.dc ul li a {

 

display:block;

padding:4px;

font-size:12px;

 

}

 

.dc ul li a:link {

 

color: #333;

text-decoration: none;

 

}

 

.dc ul li a:visited {

 

text-decoration: none;

color: #000;

 

}

 

.dc ul li a:hover {

 

text-decoration: none;

color: #333;

 

}

 

.dc ul li a:active {

 

text-decoration: none;

color: #333;

 

}

.rightside {

text-align: right;

}

.instructionsleft {

text-align: left;

}

.style7 div .redtext strong {

color: #F00;

}

.style7 div {

font-weight: bold;

}

.emailcolorblue {

color: #00F;

}

#currentairlineForm tr .center strong {

color: #00F;

}

#previousairlineForm tr .center strong {

color: #00F;

}

#myfirstairlineForm tr .center strong {

color: #00F;

}

.left {

text-align: left;

}

#bioForm tr td {

font-weight: bold;

font-size: 20px;

}

.lgtext {

font-size: 16px;

}

.centertitle {

text-align: center;

}

 

.centerairlines {

text-align: center;

}

.centerworkstatus {

text-align: center;

}

.smtext50kbmax {

font-size: small;

}

.smller {

font-size: 18px;

}

.small50kbmax {

font-size: 12px;

}

#websiteForm tr td strong {

text-align: left;

}

#locationForm tr td div .boldlocation {

color: #00F;

}

#locationForm tr td div .boldlocation {

font-weight: bold;

}

#locationForm tr td div .boldlocation {

font-size: 16px;

}

#locationForm tr td div .boldlocation {

font-size: 18px;

}

.search_results a:link {

text-decoration: none;

}

Link to comment
Share on other sites

I uploaded your code and gave your outer table a border, just so we could better see where things are, and your table is centered: See Here

(Your includes won't show, since I don't have the files uploaded)

 

HOWEVER - there is absolutely no good reason to use tables for this.

 

Here, I've gotten rid of the tables and used proper CSS positioning:

 

You should also not use empty p tags to create space - use your CSS and add margins or padding.

In your CSS, there's no point in adding any margins to your body - the body is pretty much the monitor space you see. All you could do is add padding, which would move in anything inside your body. And don't text-align center anything in the body, unless you really want all your text centered.

To center your content, I've created a division called 'wrapper' (you could call it Elvis_Presley - the name is irrelevant, but it's helpful to use descriptive names) and in my CSS, I'm giving the wrapper a width and centering it via a margin of auto, created a division for your main and right content, and floated both of those. You'll now have to add a clear: both to whatever division follows the floats, and there you go:

 

This is just the basic positioning, detail depends on what you want things to look like. Also note that I used the h2 tag for your title, assuming the h1 is better spend in whatever portion is in your include.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...