vertical position of wide <table> in 3 column <div> css - Page 2

7 New Member

I'm new(ish) to css, comfortable using tables, but trying real hard to move away.

Please see http://84.9.125.31/developer/css_test/test5.html

NB This issue is with IE & Opera - I've tried IE 6&7 and both have the same result. It works fine in FF. Thanks to Petr Stanicek for the original example.

As you can see the table is 800px wide in the middle column and it's vertical position is affected by the amount of text in the left or right hand columns - if the table is wider than the middle column, you may need your screen res set to 1024x768. If it's less than the width of the middle <div> the vertical position is fine.

Adding css position:absolu te; to the '#left' spec works in that the table is now dispalyed at the correct vertical position in the middle column, see http://84.9.125.31/developer/css_test/test6.html , but the text in the left column flows out below the grid, defeating the object.

Given that there is a solution, the tables used will be any number of columns and could be a lot wider than 800px. I've seen a lot about non-standards compliance and display:table; BUT I'm more interested in the vertical position issue than the width/scrolling.

Any help/pointers would be greafully received.

May 11 '07

Subscribe Reply

4204

slartybartfast

New Member

I see it now and think I have a solution. Be back in a bit.

EDIT: Did you change anything? Since I posted this, I can't get it to break now. So weird.

No, nothing's changed. Just to avoid possible confusion, I'll delete the file in the second link (http://84.9.125.31/developer/css_test/test6.html) which demonstrates position:absolu te; I can always put is back again if required. Link in question is http://84.9.125.31/developer/css_test/test5.html

Edit: I just tested again in FF and IE and they still behave (for me) as described.

PS. thanks for the help!

May 14 '07 #11

slartybartfast

New Member

I see it now and think I have a solution. Be back in a bit.

EDIT: Did you change anything? Since I posted this, I can't get it to break now. So weird.

Having seen the issue, pls can you post your thoughts as to a solution. I'm about to start building a tables based solution.

May 16 '07 #12

drhowarddrfine

7,435

Recognized Expert Expert

Going to tables would be to your determent. I just don't see the problem anymore so I'm questioning whether I ever really did or I just don't understand the issue. All the browsers look the same to me.

May 16 '07 #13

Similar topics

3494

strictly, <p> inside <div> ok?

by: Xah Lee | last post by:

with strict HTML spec, can one have <p> tags inside table's <td> tag? also, in strict XHTML, can one have <p> tages inside <div>? Thanks. Xah xah@xahlee.org âˆ‘ http://xahlee.org/

.NET Framework

24478

How to do a <table> with <div> tag

by: Toby Austin | last post by:

I'm trying to replace <table>s with <div>s as much as possible. However, I can't figure out how to do the following… <table> <tr> <td valign="top" width="100%">some data that will 'stretch'</td> <td valign="top" width="300">some data that won't 'stetch'</td> </tr> </table>

HTML / CSS

3905

CSS: <div>s with borders don't surround sub-<div>s?

by: Alan Hoyle | last post by:

I was using a <table border> to generate borders around some info/images, and decided to follow the w3c guidelines and convert it to CSS boxes with borders since it wasn't really tabular data. It used to be something like this: <table> <tr> <td><img>caption</td> <td><img>caption</td>

HTML / CSS

5144

Help with <p> margins inside <div> please!

by: slim | last post by:

hi again all, i am still working on the website as mentioned in earlier threads and have hit another snag... http://awash.demon.co.uk/index.php http://awash.demon.co.uk/vd.css the php is pulling a name and placing it under the thumbnail (the text is

HTML / CSS

7572

how to achieve identical layouts achieved by <table> using <div>

by: listaction | last post by:

Hi Folks, can you help me by explaining how the code below can be translated using <div> and achieve the same effect? Thanks, LA <html> <body> <table bgcolor="#000000" width="100%" cellspacing="1">

HTML / CSS

1861

Can I prevent a <asp:Panel> from adding a <div> to the HTML?

by: Alan Silver | last post by:

Hello, I would like to know if it is possible to use a panel, but prevent it from adding a <div> tag to the HTML. The reason I want to do this is that I am using a panel to enable me to show/hide part of a page as required. I would like the part in the panel to appear on the same line as the controls that precede it, but when the panel is converted to HTML, a <div> tag is used, and that forces a new line in the browser. Any ideas? TIA

ASP.NET

5548

How do I centre an <h3> vertically inside a <div>?

by: Alan Silver | last post by:

Hello, Please pardon what is probably a dumb question, but if I have HTML like this... <div> <h3>Ferrets</h3> </div> and CSS like this...

HTML / CSS

5281

Centering an two images concentrically in a <TD> or a <DIV>?

by: harryusa | last post by:

I am trying to center 2 images concentrically which are z-indexed to lay on top of each other making an image with a border from another image that has a transparent center. I need the images to be horizonally and vertically centered within a <TD> </TD> area. No matter what I do the two image just present one above the other, albeit centered, NOT on top of each other. I originally did the entire page layout in TABLES until I found out I.E. 7...

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

8604

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

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

8895

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

8861

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

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

2330

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