Account Options

  1. Sign in
The old Google Groups will be going away soon, but your browser is incompatible with the new version.
Google Groups Home
« Groups Home
How do I line up two elements without having their content overlap?
There are currently too many topics in this group that display first. To make this topic appear first, remove this option from another topic.
There was an error processing your request. Please try again.
flag
  6 messages - Collapse all  -  Translate all to Translated (View all originals)
The group you are posting to is a Usenet group. Messages posted to this group will make your email address visible to anyone on the Internet.
Your reply message has not been sent.
Your post was successful
 
From:
To:
Cc:
Followup To:
Add Cc | Add Followup-to | Edit Subject
Subject:
Validation:
For verification purposes please type the characters you see in the picture below or the numbers you hear by clicking the accessibility icon. Listen and type the numbers you hear
 
laredotornado  
View profile  
 More options Jan 12, 9:07 am
Newsgroups: comp.infosystems.www.authoring.stylesheets
From: laredotornado <laredotorn...@zipmail.com>
Date: Thu, 12 Jan 2012 06:07:21 -0800 (PST)
Local: Thurs, Jan 12 2012 9:07 am
Subject: How do I line up two elements without having their content overlap?
Hi,

I'm using the latest version of Firefox and Chrome on Win XP. I want
to display two tables on the same horizontal plane. However, I'm
having a problem. Right now I have

<table width="100" style="display: inline-block;">
    ...
</table>
<table width="100" style="display: inline-block;">
    ...
</table>

Right now, the two tables overlap because the text content of the
first table is bigger than 100 pixels. Without changing the width,
does anyone know how I can change/add to the styles so that the second
table will appear to the right of the first table but clear all of the
first table's contents?

Thanks, - Dave

PS - I know tables are evil.  This code was autogenerated by GWT, with
the exception of the styles, which I control.


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Jukka K. Korpela  
View profile  
 More options Jan 12, 9:36 am
Newsgroups: comp.infosystems.www.authoring.stylesheets
From: "Jukka K. Korpela" <jkorp...@cs.tut.fi>
Date: Thu, 12 Jan 2012 16:36:59 +0200
Local: Thurs, Jan 12 2012 9:36 am
Subject: Re: How do I line up two elements without having their content overlap?

2012-01-12 16:07, laredotornado wrote:
> I want
> to display two tables on the same horizontal plane. However, I'm
> having a problem.

I just answered the question in the forum where I first saw it asked:

http://stackoverflow.com/questions/8827220/how-do-i-line-up-two-table...

--
Yucca, http://www.cs.tut.fi/~jkorpela/


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
tlvp  
View profile  
 More options Jan 12, 1:34 pm
Newsgroups: comp.infosystems.www.authoring.stylesheets
From: tlvp <mPiOsUcB.EtLlL...@att.net>
Date: Thu, 12 Jan 2012 13:34:33 -0500
Local: Thurs, Jan 12 2012 1:34 pm
Subject: Re: How do I line up two elements without having their content overlap?

Jukka offers one strictly css-focussed way; another way might be to add

   align="left"

into the left-most table's opening <TABLE ... > tag -- as in this ...

--- [SAMPLE] ---

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<HTML><HEAD><TITLE>Table Test</TITLE></HEAD>
<BODY>

<table align="left" width="100"><tr><td> far too much stuff to fit </td>
<td> more<br> stuff </td></tr></table>
<table><tr><td> STUFF </td>
<td> more<br> STUFF </td></tr></table>

</BODY></HTML>

--- [end of SAMPLE] ---

 (tested only in Safari, but working there; and valid HTML).

HTH. Cheers, -- tlvp
--
Avant de repondre, jeter la poubelle, SVP.


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Gus Richter  
View profile  
 More options Jan 12, 4:32 pm
Newsgroups: comp.infosystems.www.authoring.stylesheets
From: Gus Richter <gusrich...@netscape.net>
Date: Thu, 12 Jan 2012 16:32:18 -0500
Local: Thurs, Jan 12 2012 4:32 pm
Subject: Re: How do I line up two elements without having their content overlap?
On 1/12/2012 9:07 AM, laredotornado wrote:

With the information provided, text does not "overlap" but is limited
within the width specified for both tables.

--
Gus


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
dorayme  
View profile  
 More options Jan 12, 6:14 pm
Newsgroups: comp.infosystems.www.authoring.stylesheets
From: dorayme <dora...@optusnet.com.au>
Date: Fri, 13 Jan 2012 10:14:54 +1100
Local: Thurs, Jan 12 2012 6:14 pm
Subject: Re: How do I line up two elements without having their content overlap?
In article
<454f574b-cca4-482a-965c-eb7ee22ee...@m11g2000yqe.googlegroups.co
m>,

<http://dorayme.netweaver.com.au/tableSideBySide.html>

should be OK for FF and many modern browsers. IE is a different
matter and you might, as JK suggests, wrap the tables in DIVs and
maybe something like

<http://dorayme.netweaver.com.au/tableSideBySide2.html>

--
dorayme


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Ben C  
View profile  
 More options Jan 21, 12:10 pm
Newsgroups: comp.infosystems.www.authoring.stylesheets
From: Ben C <spams...@spam.eggs>
Date: Sat, 21 Jan 2012 11:10:41 -0600
Local: Sat, Jan 21 2012 12:10 pm
Subject: Re: How do I line up two elements without having their content overlap?
On 2012-01-12, laredotornado <laredotorn...@zipmail.com> wrote:

> Hi,

> I'm using the latest version of Firefox and Chrome on Win XP. I want
> to display two tables on the same horizontal plane.

I've actually never once managed to get anything to display in a
different horizontal plane in any browser.

> However, I'm
> having a problem. Right now I have

><table width="100" style="display: inline-block;">

Use display: inline-table (although inline-block will also work-- you'll
get an anonymous table inside the inline block).

>     ...
></table>
><table width="100" style="display: inline-block;">
>     ...
></table>

> Right now, the two tables overlap because the text content of the
> first table is bigger than 100 pixels. Without changing the width,
> does anyone know how I can change/add to the styles so that the second
> table will appear to the right of the first table but clear all of the
> first table's contents?

Put white-space: nowrap on the container, and then the two tables will
stay side by side even if it means overflowing the container.

 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
End of messages
« Back to Discussions « Newer topic     Older topic »