Why doesn't the width match?

cosmo_canuck

I'm wondering why my content and footer tables in this layout don't
match the header and menu - even though they're also set to 600 pixels
- both the CSS div's and the tables themselves. I can't see any
difference between the top image and menu tables, and the content and
footer. Other than that the latter two don't have images stretching
them to their full 600 px width.... hmm...

Page: http://jeffkirkey.com/test.html
CSS: http://jeffkirkey.com/jeffkirkey.css

Does this have anything to do with the code which I'm using to keep
things centered? Hope not - getting it to that point was frustrating
enough....

Any help appreciated - thanks!

Adam

Dec 1 '05 #1

Subscribe Reply

2064

C A Upsdell

cosmo_canuck wrote:

I'm wondering why my content and footer tables in this layout don't
match the header and menu - even though they're also set to 600 pixels
- both the CSS div's and the tables themselves. I can't see any
difference between the top image and menu tables, and the content and
footer. Other than that the latter two don't have images stretching
them to their full 600 px width.... hmm...

Page: http://jeffkirkey.com/test.html
CSS: http://jeffkirkey.com/jeffkirkey.css

Does this have anything to do with the code which I'm using to keep
things centered? Hope not - getting it to that point was frustrating
enough....

Any help appreciated - thanks!

Hmmm. 17 HTML errors:

http://validator.w3.org/check?verbos....com/test.html

which includes non-standard tags and attributes.

Also, the DOCTYPE lacks the URL, so will trigger quirks mode in IE, and
as you know(?), IE gets the box model wrong unless it is IE6 and
standards mode is triggered.

Dec 1 '05 #2

Mark

cosmo_canuck wrote:

I'm wondering why my content and footer tables in this layout don't
match the header and menu - even though they're also set to 600 pixels
- both the CSS div's and the tables themselves. I can't see any
difference between the top image and menu tables, and the content and
footer. Other than that the latter two don't have images stretching
them to their full 600 px width.... hmm...

Page: http://jeffkirkey.com/test.html
CSS: http://jeffkirkey.com/jeffkirkey.css

Does this have anything to do with the code which I'm using to keep
things centered? Hope not - getting it to that point was frustrating
enough....

Any help appreciated - thanks!

Adam

table.table1 {
....
width:602px;
}

helps in Firefox, but i will not be the real answer...

Dec 1 '05 #3

cosmo_canuck

Fixes it in Safari and IE 5 on the Mac too. But yes, it seems like an
unreliable solution...

As for C A Upsdell's comments, yes, there are nonstandard tags and I'm
still sorting out the DOCTYPE thing. I'm still trying to wrap my head
around CSS... and actually in this case I'm hoping to get some of the
benefits of CSS without going 100% table free. Apologies to the purists
but it's a challenge writing perfectly validated code!

Thanks for your help!

Dec 1 '05 #4

Jim Moe

cosmo_canuck wrote:

I'm wondering why my content and footer tables in this layout don't
match the header and menu - even though they're also set to 600 pixels
- both the CSS div's and the tables themselves. I can't see any
difference between the top image and menu tables, and the content and
footer. Other than that the latter two don't have images stretching
them to their full 600 px width.... hmm...

It's mostly because of the weird mash of CSS and table-based/tag-soup
layout. Use CSS for styling, not tables.
The tables can be completely removed. They offer nothing except
increased bandwidth. The menu can be easily replaced with a <ul>.
See <http://css.maxdesign.c om.au/listamatic/>.
Finally, use HTML 4.01 Strict. Transitional was only for migrating
legacy code to 4.01, then to Strict which disallows many of the attributes
you are using.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Try this CSS. It styles the DIVs, not the tables:
p {}
tr,td { text-align:left; border: 0; padding: 0;}

table { width: 100%; }
table.table1 { }

#title, #menu, #content, #footer {
border: 1px black solid;
width: 600px;
margin-left:auto;
margin-right:auto;
}

#title, #menu {
border-top: 0;
border-bottom: 0;
}
#content, #footer { border-top: 0; }

#title img { vertical-align: bottom; }
#menu td { text-align:center; }

#content td, #footer td { padding: 0.5em; }
#content { background: #fff; }
#footer { background-color: gray; }
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

Dec 1 '05 #5

Similar topics

7199

Sessions (another why doesn't it work)

by: Chewy509 | last post by:

Hi Everyone, I'll just start, and say I am not a PHP developer (I'm a sysadmin, who has gotten lumped with a non-working website). But since I like to do this type of stuff, I though I might just learn WTF is going on? :) Basically, sessions are being created, but no info in being stored in the session, and if data is stored (about 1 in 20 goes), it doesn't follow-on on a page redirect.

PHP

2824

Table width is ignored if cell contains query string

by: RBalbat | last post by:

Hello all, I have encountered an unexpected problem where if I render a table (in IE or Opera) and there are cells that contains URLs with long query strings, even though I specify the table element with the width attribute set as 90%, when I render the document, it spans way off the right side of the screen. For some reason, having a long query string in the cell does some funcky stuff. Does anyone know how to *force* the table to only...

HTML / CSS

2354

<asp:imagebutton height and width ignored in mozilla

by: Michael Evanchik | last post by:

The following tag works fine in internet explorer, but in mozilla the image is not sized and left at its actualy size. Anyone know why? I though asp.net works on any browswer. <asp:imagebutton id="Image1" Runat="server" onclick="enteraccount" height="90" width="120" ImageUrl="images/account.gif" />

ASP.NET

354

Nested datalists and width property of TD

by: schapopa | last post by:

I have two nested datalists and I am using percentage to make the width of the row: So my header of the parent datalist looks like this... <table><tr> <td width = 5%> <td width = 12%> <td width = 16%> <td width = 16%> <td width = 12%> <td width = 5%>

ASP.NET

2550

CreateUserWizard validation doesn't work

by: VB Programmer | last post by:

I have several required field validators on each step of my CreateUserWizard. When I click Next it goes to the next step, even though the user hasn't typed anything in. I placed each "page" of validators in their own validation group. Any ideas why this isn't working?

ASP.NET

2327

Why doesn't this work in Opera?

by: patrick j | last post by:

Hi I'm wondering why my horizontal navigation lists don't align at the left in Opera as they do in IE6, IE7, Safari, Firefox and iCab? A URL with both of the horizontal lists is here: <http://www.patrickjames.me.uk/bicycle/mymoultons.html> The link for "Hello" should align with the link for "My Moultons" and

HTML / CSS

1476

xforms doesn't returned correctly

by: li72 | last post by:

Hi. I’m new to XForms society and struggling with a basic concepts. However, I’m trying to transform an xml doc into XForms using XSLT. The browser renders the Xforms just fine but there is no effect to bind element. For instance the third UI control should be rendered as a calendar because its type is xs:date However, I got a normal input box instead. Also property required= “true()” has no effect. Any help is much appreciated. Here is my...

XML

1830

Column count doesn't match value count at row 1

by: ashraf02 | last post by:

hi i am trying to insert a record via a form using php and mysql and when i try to submit the form it comes up with the following error Column count doesn't match value count at row 1 if someone can please help me overcome this error i would be grateful. the insert_shirt.php code is:

PHP

3061

Submit onchange doesn't work

by: colyn7 | last post by:

I really can't see what's wrong in my code... the submit() onChange doesn't work.. I've tried.. <select name="ddlTestCenter" id="ddlTestCenter" style="width:180px" onChange="this.form.submit();"> it doesn't work... <input type="hidden" name="hiddenopt" value="secret"> <select name="list" onChange="document.forms.submit();">

Javascript

8816

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

8497

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

8598

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...

General

7310

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

6162

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

5627

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

2721

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

1928

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

1598

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