can we place table manually in html page..........

Question

Jessurider -10 Posting Whiz in Training

15 Years Ago

can anyone tell

1.how to place table manually at some position
2.how can we bring another objects such as images,or text above table........and table behind them

html-css web-design

4 Contributors
4 Replies
104 Views
18 Hours Discussion Span
Latest Post 15 Years Ago Latest Post by almostbob

Dani AI

Generated 10 Months Ago

The markup shown by has three root problems that explain the layout trouble: multiple <body> tags and deprecated presentation attributes, an absolute Windows file path for the image, and using tables for page layout. was right to ask what was tried; ’s advice to learn CSS is spot on, and is correct that a proper doctype makes positioning reliable.

A concise modern approach:

Use the HTML5 doctype and one <body>. Move all presentational attributes into CSS.
For a header image with text on top, make the header a positioned container (position: relative) and set the image as a CSS background (or an <img> inside the header). Put the heading inside the header and give it position: absolute plus a higher z-index so it sits above the image.
For layout, prefer Flexbox or Grid for columns (left form, right news) instead of nested layout tables. Use <table> only for tabular data (search results).
Use relative or web paths for images and include alt text for accessibility.

Troubleshooting checklist:

z-index only affects positioned elements (position other than static). If an overlay doesn’t appear, verify the overlay and its parent are positioned and that no ancestor creates an unexpected stacking context (transforms, filters, or opacity can do this).
Avoid negative z-index unless intentionally placing content behind the page. Check computed styles with browser devtools to see stacking order.
Replace <marquee> and other deprecated tags with CSS animations or accessible scripts.

Example (minimal pattern):

<!doctype html>
<style>
header{position:relative;height:126px;background:url('images/sunset.jpg') center/cover no-repeat;}
header h1{position:absolute;left:20px;top:20px;color:#fff;z-index:2}
main{display:flex;gap:1rem;padding:1rem}
</style>
<body>
<header><h1>Search Employee</h1></header>
<main><div class="left">...table...</div><aside class="right">news</aside></main>
</body>

Common fixes: ensure a single <body>, use background-image for decorative headers, set parent to position:relative, and put overlay text with position:absolute plus a higher z-index.

All 4 Replies

twiss 155 Veteran Poster

15 Years Ago

What have you tried? What doesn't work?

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Jessurider -10 Posting Whiz in Training · Answer 1 · 2011-05-12T21:34:27+00:00

can u see the image in the html page.............how do i write my webpage title and heading over that image,.................

this is the code.........

<html>
<head>
</head>
<body>

<body topmargin="0" leftmargin="6"> 

<img src="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Sunset.jpg" width="1024" height="126" >
<body bgcolor="#FFE193">

   <table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
    <td width="50%" align="left" valign="top"><table border=0 width="500" align="leftcorner" bgcolor="#CDDFFF">
      <tr>
        <td colspan=2 style="font-size:12pt;color:#00000;" align="center"><font size=5> Search Employee </font></td>
      </tr>
      <tr>
        <td ><b> Employee Name</b></td>
        <td>:
          <input  type="text" name="emp_name" id="emp_name"></td>
      </tr>
      <tr>
        <td ><b>Department</b></td>
        <td>:
          <input  type="text" name="emp_dept" id="emp_dept"></td>
      </tr>
      <tr>
        <td ><b>Email</b></td>
        <td>:
          <input  type="text" name="email" id="email"></td>
      </tr>
      <tr>
        <td colspan=2 align="center"><input  type="submit" name="submit" value="Search"></td>
      </tr>
    </table></td>
    <td width="2%">&nbsp;</td>
    <td width="28%"><table width="100%" height="180"  border="0" align="rightcorner">
      <tr>
        <td align="top" height="135" valign="top" bgcolor="#BDECFE"><marquee height="150" align="left"  direction="up" scrollamount="2" scrolldelay="1" onMouseOver="this.stop()" onMouseOut="this.start()" >
          <a href="news.asp" class="more">Faith InfoTech Academy for Professional Advancement starts operations at Technopark<b></a><br />
          <br />
          <a href="news.asp" class="morelink">Faith InfoTech Academy for Professional Advancement starts operations at Technop...</a><br />
          <br />
          <a href="news.asp" class="more">Mr. R. Narayanan joins Faith InfoTech as Chief Mentor and Director.</a><br />
          <br />
          <a href="news.asp" class="morelink"><b>Mr. R. Narayanan joins Faith InfoTech as Chief Mentor and Director.</b> <br>
            ...</a><br />
          <br />
          <a href="news.asp" class="more">Faith InfoTech engaged by RevenueMed to deliver training in IT enabled health services.</a><br />
          <br />
          <a href="news.asp" class="morelink"><b>Faith InfoTech engaged by RevenueMed to deliver training in IT enabled health...</a><br />
          <br />
        </marquee></td>
      </tr>
    </table></td>
  </tr>
</table>

<br><br><br>
</body>
</html>

Arkinder 93 Posting Pro in Training · Answer 2 · 2011-05-13T02:31:10+00:00

Most, if not all, of the attributes you're using are deprecated. To accomplish what you want you will need CSS, and I recommend brushing up on your HTML too. Here are are few places to help you with that:

https://developer.mozilla.org/en-US/docs
http://code.google.com/edu/submissions/html-css-javascript/
http://dev.opera.com/articles/view/1-introduction-to-the-web-standards-cur/#toc
http://www.w3.org/wiki/HTML
http://htmldog.com/

Regards
Arkinder

almostbob 866 Retired: passive income ROCKS · Answer 3 · 2011-05-13T05:46:43+00:00

properly declare a doctype >4 and css positioning works ie::html 4 4.01 5 xhtml1

<!DOCtype html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type='text/css'>
.fixtop { top:0;right:0;position:fixed;z-index:-100; }
.fixbottom { bottom:0;right:0;position:fixed;z-index:-100; }
</style>
</head>
<body>
<body topmargin="0" leftmargin="6"> 
<img src="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Sunset.jpg" width="1024" height="126">
<body bgcolor="#FFE193">
<table width="80%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" align="left" valign="top">
<table border=0 width="500" align="leftcorner" bgcolor="#CDDFFF">
</tr>
<tr>
<td colspan=2 style="font-size:12pt;color:#00000;" align="center"><font size=5> Search Employee</font></td>
</tr>
<tr>
<td><b> Employee Name</b></td>
<td>:
<input  type="text" name="emp_name" id="emp_name"></td>
</tr>
<tr>
<td><b>Department</b></td>
<td>:
<input  type="text" name="emp_dept" id="emp_dept"></td>
</tr>
<tr>
<td><b>Email</b></td>
<td>:
<input  type="text" name="email" id="email"></td>
</tr>
<tr>
<td colspan=2 align="center"><input  type="submit" name="submit" value="Search"></td>
</tr>
</table>
</td>
<td width="2%">&nbsp;</td>
<td width="28%"><table width="100%" height="180"  border="0" align="rightcorner">
<tr>
<td align="top" height="135" valign="top">
<!-- I just hate these *expletive* things
<marquee height="150" align="left"  direction="up" scrollamount="2" scrolldelay="1" onMouseOver="this.stop()" onMouseOut="this.start()">
<a href="news.asp" class="more">Faith InfoTech Academy for Professional Advancement starts operations at Technopark<b></a><br/>
<br/>
<a href="news.asp" class="morelink">Faith InfoTech Academy for Professional Advancement starts operations at Technop...</a><br/>
<br/>
<a href="news.asp" class="more">Mr. R. Narayanan joins Faith InfoTech as Chief Mentor and Director.</a><br/>
<br/>
<a href="news.asp" class="morelink"><b>Mr. R. Narayanan joins Faith InfoTech as Chief Mentor and Director.</b><br>
...</a><br/>
<br/>
<a href="news.asp" class="more">Faith InfoTech engaged by RevenueMed to deliver training in IT enabled health services.</a><br/>
<br/>
<a href="news.asp" class="morelink"><b>Faith InfoTech engaged by RevenueMed to deliver training in IT enabled health...</a><br/>
<br/>
</marquee>---></td>
</tr>
</table></td>
</tr>
</table>
<div class='fixtop'> this text will stay put<br/> and the rest of the page will scroll around it, the class='fixtop' </div>
<div class='fixbottom'> this text will stay put<br/> and the rest of the page will scroll around it, the class='fixbottom' </div>
<p>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/>lorem ipso filler BS<br/></p>
<br><br><br>
</body>
</html>

giving the table a css position will accomplish anything you require, NOT saying anything about the code for the tables, deprecated (defecated) for sure

can we place table manually in html page..........

Dani AI

Recommended Answers Collapse Answers

All 4 Replies

Recommended Answers