Solved

Content around a table

Posted on 2002-05-09
29
181 Views
Last Modified: 2010-04-09
Hi,

I want to put some content around a table, like
image -- table -- text
I want these to appear next to one another in one row
Now this code:
-------------

<img src="myImg.jpg">
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>A</td>
    <td>B</td>
  </tr>
  <tr>
    <td>C</td>
    <td>D</td>
  </tr>
</table>
This is some text
--------------

results in:
myImg.jpg
table
This is some text

How to modify this code to achieve what I want(for 4.x+ browsers)?
I don't want to put the image,table and text inside  another table, or to use something like absolute positioned div's

Thanks
0
Comment
Question by:hveld
  • 8
  • 7
  • 5
  • +5
29 Comments
 
LVL 18

Expert Comment

by:mgfranz
ID: 6998931
Nested table;

<table border=0 cellspacing=0 cellpadding=5>
<tr>
   <td><img src="myImg.jpg"></td>
   <td><table border="0" cellspacing="0" cellpadding="0">
          <tr>
             <td>A</td>
             <td>B</td>
          </tr>
          <tr>
             <td>C</td>
             <td>D</td>
          </tr>
       </table>
   </td>
   <td>This is some text</td>
</tr>
</table>
0
 

Author Comment

by:hveld
ID: 6998946
in my question i said i don't want to put the things in another table :)
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6998947
>>>I don't want to put the image,table and text inside another table, or to use something like absolute
       positioned div's

Then you will have to invent a new browser and get you users to use, because thow are the two possible solutions.  The image and table are block elements. They have the properties of block elements, and they behave like block elements.  Therefore, in your new browser you will either have to make tham not be block elements or change the behaviour of block elements.

Cd&
0
 
LVL 18

Expert Comment

by:mgfranz
ID: 6998953
Yeah... sorry.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6998956
I suppose one additional possibility would be to use frames, but it would be a truly strange approach. Like using a hammer to put in a screw while holding a screwdriver in the other hand.

Cd&
0
 
LVL 18

Expert Comment

by:mgfranz
ID: 6998963
LOL...

I don't understand why you don't want to use nested tables...
0
 
LVL 18

Expert Comment

by:bruno
ID: 6999026
The answer is "You can't do that".

Not with the stipulations you have at least.  
0
 
LVL 51

Accepted Solution

by:
ahoffmann earned 100 total points
ID: 6999675
not for 4.x browsers (except Opera;-)

<HTML>
<HEAD><STYLE TYPE="text/css">
  table { display: inline; }
  img   { display: inline; }
  /* fiddle arround with margin, padding, etc. as you like */
</STYLE></HEAD>
<IMG SRC="myImage.jpg">
<TABLE BORDER=0>
        <TR><TD>A</TD><TD>B</TD></TR>
        <TR><TD>C</TD><TD>D</TD></TR>
</TABLE>
Some text here
</HTML>
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6999711
Still does not meet the requirement, and the alignment in IE5.5 if ugly.  Hate to think how much work it would be if the content of the table is variable, unless you can align it all at the top.

Cd&
0
 
LVL 51

Expert Comment

by:ahoffmann
ID: 6999770
which requirement did I miss?
even 4.x (Opera) works ;-)
There was no reference to IE x.x.

The table content might be a problem worth thinking about. Means if the table does not fit into the browser window, it must be rendered. Something the author must be aware of ...
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7005547
<img src="myImg.jpg" align=left>
<table border="0" cellspacing="0" cellpadding="0" align=left>
 <tr>
   <td>A</td>
   <td>B</td>
 </tr>
 <tr>
   <td>C</td>
   <td>D</td>
 </tr>
</table>
This is some text
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 7005691
leveret,

Welcome to Experts-exchange.  Please read the guidelines for answers and comments.  Taking an active quetion off the active list is considered by most memebers to be rude and unprofessional.  

While your solution will work for some browsers, it it neither cross-browser orcross-resolution copatible, and uses depreciated properties.

It may well be that the user decides that your solution is the best offered, but it is up to the user.  Do not attempt to force your solution on the user by using the answer button.

I always recommend to new users that they observe how the top-experts conduct themselves.  If you do that you will note that the answer button is almost never used in the civilized topic areas.

Cd&
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7006054
COBOLdinosaur,

1) There is nothing so much wrong about using a deprecated property. We are normally supposed to produce working sites, and not the sites which fully correspond with w3c recommendations. In cases when satisfying both conditions is not advantageous, we of course pay more attention to the first issue.

Using deprecated properties is not as dangerous as some people might think. "User agents should continue to support deprecated elements for reasons of backward compatibility" (http://www.w3.org/TR/html4/conform.html#deprecated). This statement obviously makes sense and I would hardly believe that some producer of a browser would venture to break this rule in the foreseeable future. It is far not the time to forget the past (no matter how many things were done not the way they should).

In our particular case align=left makes both block elements <table> and <img> floating. This leads to some confusion when developing further element's properties and this is likely to be a reason to announce the property deprecated. I see the logic here but the reality is that floating properties work and are going to work for a long time (if not forever) in the future.

2) Cross-browser issue is a clear and vague issue at once. It just depends how many browsers you include in your list. I tested the example in NN4.75, NN6.2.1, IE5.5, Opera 5.12. Did you mean something wrong, that I haven't noticed or did you mean another browser? Or... did you actually mean future browsers? (then it's again the 1st issue of deprecated properties).

P.S. Actually, I was really surprised :-[ ] , that the topic was closed after I posted my suggestions. I haven't met any text/rules, describing *this* feature of the answer post in this forum.
Sorry, no answers any more ;)
0
 
LVL 18

Expert Comment

by:bruno
ID: 7006194
>>Sorry, no answers any more ;)


that's all he was getting at.  "Answering" takes the Q out of the "open Q" list and locks it, thus taking away attention.  As respect for the questioners, most experts here have chosen to simply ignore the answer option now.


BRUNO
0
Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

 
LVL 18

Expert Comment

by:mgfranz
ID: 7006294
Do we still have the ability to "withdraw" an "answer"?
0
 
LVL 18

Expert Comment

by:bruno
ID: 7006300
nope, don't think we ever did??

only way is to ask CS to unlock the Q....

part of my "generic" post..

"It would also be appreciated if you would take care of this problem yourself.  You can post a 0 point Q in Community Support ( http://www.experts-exchange.com/jsp/qList.jsp?ta=commspt ) with a link to this question and ask them to please reject your proposed answer. "
0
 
LVL 18

Expert Comment

by:mgfranz
ID: 7006312
We use to be able to "withdraw" a posted "answer" a few years ago, I seem to remember it only lasting about 6 months though...
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7006338
> "Answering" takes the Q out of the "open Q" list and locks it

This is really strange. I would understand if the author or some moderator has the opportunity to lock the thread, but for a person who answers that's a really needless option.
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7006365
> "Answering" takes the Q out of the "open Q" list and locks it

This is really strange. I would understand if the author or some moderator has the opportunity to lock the thread, but for a person who answers that's a really needless option.
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7006391
> "Answering" takes the Q out of the "open Q" list and locks it

This is really strange. I would understand if the author or some moderator has the opportunity to lock the thread, but for a person who answers that's a really needless option.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 7006462
I never said there was anything wrong with using depreciated properties.  However it is an issue in some questions, and you cannot make the assumption that a solution in an answer because it works under some conditions.  The compatibility issues are not whether it will work for most current browsers, but whether it will render the same in all browsers considering that the content consists of an unsized image, an unsized table and free-format text that is not in a rendering box.  Th positioning methods vary from browser to browser and between various version.

The point is that there is not enough information to say any answer is definitive.  Getting a snippet to produce a preceived correct result without a complete requirement, may or may not solve the problem.

As to why the answer button is the way it is, that is a combination of engineering problems, a long historical debate on how it should work and indecision on the part of site management.  Prior ro the conversion to jsp on the server side it was possible to convert your answer to a comment.  Currently it is only possible for a mod or admin to convert it by rejecting the answer.

At some point EAB may be able to get resolutin of the problem, but whatever we do, there will be some members who disagree.

Cd&
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7008193
Heh, all solutions work under some conditions. The first condition for a solution to work is a presence of a browser as such. I guess an example of bad positioning - real or assumed would draw this conversation out of general phrases.

Personally I don't find this question a snippet. Main requirements are clearly stated. The question is short enough not to cover all the countless variety of possible situations.

Usage of floating property seems to be the only possible way here (no 'extra' tables or layers). Of course it should be used properly, but this is something that we should always do ;) In this particular case only exceeding screen width might cause some problems, but counting how was the problem given, this is something that author should avoid anyway, and thus it makes this aspect a separate question.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 7008414
Based on that approach, a user can get some answer anywhere.  There is no educational value.  This is, of course, a valid approach in a kiddie forum.  We do more than tat here.  The idea is to find solutions.  The description from the user indicates a desisng that will have multiple problems beyond the question asked.  Positioning this way will almost certainly create more problems than it solves.  

Every expert in this thread already knows how to solve this using what has been rejected, and there is nothing to indicate why such contraints are necessary.  If we can give the user a profesional solution to a design problem, the site has value over and above a forum.  Of course, whether an expert chooses to give answers, solutions, or full support is up to the individual.

Cd&
0
 
LVL 2

Expert Comment

by:Marianne
ID: 7008555
> Positioning this way will almost certainly create more problems than it solves.

"I guess an example of bad positioning - real or assumed would draw this conversation out of general phrases."
0
 
LVL 6

Expert Comment

by:Mindphaser
ID: 7010869
Rejected per request

** Mindphaser - Community Support Moderator **
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 7101882
This question has been abandoned. I will make a recommendation to the
moderators on its resolution in a week or two. I appreciate any comments
that would help me to make a recommendation.
<note>
   In the absence of responses, I will recommend DELETE where there is any
   question about its value as a PAQ.  Silence = you don't care
</note>

Cd&

0
 
LVL 18

Expert Comment

by:bruno
ID: 7101989
who knows....too many stipulations put on it...
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 7130621
It is time to clean this abandoned question up.  

I am putting it on a clean up list for CS.

<recommendation>
points to ahoffmann

</recommendation>
Does not cover it all and is really ugly but it is a tleast a partial solution

If anyone participating in the Q disagrees with the recommendation,
please leave a comment for the mods.


Cd&
0
 
LVL 5

Expert Comment

by:Netminder
ID: 7178239
Per recommendation, force-accepted.

Netminder
CS Moderator
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Popularity Can Be Measured Sometimes we deal with questions of popularity, and we need a way to collect opinions from our clients.  This article shows a simple teaching example of how we might elect a favorite color by letting our clients vote for …
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

746 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now