HTML - Expanding Tables

wanted to get an effect like this:

http://www.azeotek.com/product_p/hg-m2.htm

as you can see when you scroll over the image it has an expanded view. obviously it's some sort of java or code i have no idea how to do.. suggestions?

Hi everybody!

OK..i am a complete newb when it comes to coding and web design. I have been trying to build a website for a new online business I'm starting. Its not finished but i thought i'd publish it and check it on a few browsers, its fine in Safari, Firefox but in IE7 it looks terrible.

Dreamweaver is telling me i have an expanding box problem. I have read around and tried a few workarounds but nothing seemed to work, but then i don't really know what i'm doing! Can anybody help?

the URL is: www.atomicaudio.co.uk

any advice would be greatly appreciated

thanks, Dan

I need help
Im tryng to create my webpage so that there are no scroll bars on the right or bottom. I want the content to fit right on screen without the need to scroll to view more content. But my problem is, my page is not even filled up yet, i only have my navigation on top plus my table in the center. my table width is "100" and height="50". its small on the page but everytime i expand it abit more, it makes the entire webpage bigger then the scroll bars start appearing.
Im tryna make a page that fits right on screen without need to scroll.
Is there a code to fix this. ?/

Hi
How do you create a list that when you hover over it expands. As you can tell I'm new to HTMl.

Thanks
Bob v

Hi Guys,

I have a page that seems to render fine in Firefox, but looks awry when I view it in IE. Could someone point out what the problem is and how to fix it?

I've done some research on my own, and think it might have to do with IE's expanding box problem:

http://www.adobe.com/cfusion/communi...NG_BOX_PROBLEM

However, I haven't done much coding since 2001, so I could really use a helping hand. Thanks very much.

URL of problem page:

http://cervantes.webng.com/sims.html

I am looking for a code that when you click a link, it expands an area below it with out reloading the page or switching pages. I have seen it before, just click a link and it pops open a invisible box of (whatever) information you want, click the link again and the box turns invisible again. Sorry if I am not explaining this correctly.

I'm working on a website and I'm running into a problem with the left side cells.

http://www.kbrmarketing.com/kbrnew/pages/problem.html

If you look at the side on FF (3) is looks correct, but when you look at in in IE (i'm using 7) it's gets stretched out.
I want only the bottom cell to expand as the page gets longer.

Here's some pictures to help explain
< IE
< FF


I just inserted those line breaks to extend the page to show you guys the problem.
Eventually those breaks will be replaced with text and pictures.
(the <br>'s are in the right cell, which causes the left cells to then expand)

Hi

Normally, when you have more than one table in your code, the tables will be placed one under each other.

Example:
<table>
...
</table>
<table>
...
</table>

When you want the tables to be placed next to each other, you need to set the align attribute.

Example:
<table align="left">
...
</table>
<table align="left">
...
</table>

BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables".

Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag?

Thanks for your help
praiser

I've figured out how to embed YouTube videos into a vBulletin installation of mine. How would I go about making a vertically expanding table that expand when the user would click on the "YouTube" text? I'm thinking of starting out out as a size maybe 100px high and 400px wide, and expand to 375px high and 450px tall. I've checked Google, but nothing seemed to come up that I could use.

I have a table and it expands. One bottom "Author" row expands when I put data in the top row "Words". How do I stop this from happening.


Code:

<div id="apDiv20">
  <table width="231" height="190" border="0">
    <tr>
      <td height="23" colspan="3"><div align="justify"><span class="style4 style10">';echo $Title[1]; echo'</span></div></td>
      <td height="23">&nbsp;</td>
    </tr>
    <tr>
      <td height="135" colspan="3">';echo $Words[1]; echo'<div align="justify">
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
      </div></td>
      <td height="135">&nbsp;</td>
    </tr>
    <tr>
      <td width="48" height="23"><span class="style9">Author:</span></td>
      <td width="73"><div align="justify"><strong><span class="style3 style10">';echo $author[1]; echo'</span></strong></div></td>
      <td width="52"><span class="style13">share</span></td>
      <td width="40"><pre class="style2">&nbsp;</pre></td>
    </tr>
  </table>
</div>

Hi all,
I am new to HTML and I would like to request you all to help me out of my situation. I use three frames for my website as shown in the screenshot. What I am concerned about is the Left Menu which should expand and collapse automatically when selecting a different set of menu. Also the currently selected menu should be highlighted as shown in the screenshots.
Since am new to HTML can someone please provide some sample codes and functions (javascripts) that could be used to generate this output. Your help in this regards is highly appreciated with gratitude.
Thanks in advance to one and all who ever gives a look at this thread to help me out.
Regards
Subramanian

this issue is urking me, i must be missing a style.
what can i do to get this page top box to cooperate. HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
 .contentTopBox {
	margin-bottom: 5px;
	margin-left: 15px;
	margin-right: 15px;
	border: 1px solid;
	background-color: #999999;
	height: 112px;
 }
.contentTopBoxRightPortion {
	background-color: #333333;
	float: right;
	padding: 5;
	text-align: center;
	overflow: hidden;
	background-color: #333333;
	width: 180px;
}
.contentTopBoxLeftPortion {
	float: left;
	width: 79%;
	padding-top: 35px;
	overflow: hidden;
	padding-left: 10px;
	padding-right: 10px;
}
 .contentTopBox .siteHeader {
	color:  #666666;
	color:  #666666;
	background-color:  #Fefefe;
	border: 1px solid;
	font-weight: bold;
	font-size: 130%;
	padding-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
	display: block;
	overflow: hidden;
	width: auto;
  }
-->
</style>
</head>

<body>
	<div class="contentTopBox">
		<div class="contentTopBoxLeftPortion"><span class="siteHeader">Page Title</span></div>
		<div class="contentTopBoxRightPortion"><img src="mals/lib/3-wolf-rock-2.gif" alt="3 wolves carved into a rock" width="170" height="100" /></div>		 	   
	</div>
</body>
</html>

on the right of the box is a 120px nav bar, and on the left is an ad banner. those arent included on this page. this bar fills in the content box area inbetween the navs.

the problem im having is when viewed at 1680x1050 the bar works fine, but when the browser is crunched down towards 800x600 the image on the right flops(wraps) below the title header as if there is some percentage of width that finds itself running into the contentTopBoxRightPortion box.

what i need;
on the right, I need the image to be solid in place, with 5px padding around it, that takes care of the right side.
and on the left i need the siteHeader bar to expand accordingly(max width atlease 1600 px for 2000px monitor) , with approximately 10px of padding on the left and the right, no matter what the browser size.
Also i would like the siteHeader bar to automatically find the middle (vertical align-middle) related to varying heights that the contentTopBox may be set to to accommodate varying rightPortion images.

Everything was working fine on FF when i had a 2 column table, except on IE7 of course, but i really DONT LIKE TABLES, and want to do away with them
i have tried span tag vs. div tags, and clearing divs, and of course every type of float and overflow, and switching the location of the left column and right column code in the html, so i must be missing something, and am spending way too much time on this otherwise simple issue :-).

what am i missing?

Hi,

Recently i have designed a site on my personal Dell laptop. The screen width of my laptop is more than the length.

I have kept the logo on the header side of the page, in my laptop everything looks fine, but when i see it in a desktop or any other computers the image or logo is looking aukward.

When i see the same page at different laptops or desktops where the screen widths are more than the lenghts the image looks fine.

Here i am attaching the page which shows the logo.

Please find the code below which references a image(logo) in the page.

Could any one please check this and let me know the reasons for this kind of look.

Regards,
Vikram

<TD width="40%">
<TABLE cellSpacing=0 cellPadding=0 width=209>
<TBODY>
<TR>
<TD bgColor=#0295e5>&nbsp;</TD></TR>
<TR>
<TD align=middle><A
href="http://eastyconsultants.com/index.html"><IMG
height=150 alt="Easty Consultancy Services"
src="images/logo.gif" width=339
border=0></A></TD></TR></TBODY></TABLE></TD>

<TD width="60%">
<TABLE cellSpacing=0 cellPadding=0 width=209>
<TBODY>
<TR>
<TD class=toplinks style="PADDING-RIGHT: 2px"
align=right bgColor=#fb6c00 height=20><IMG
height=8 alt="" src="images/contacttop.gif"
width=12> <A class=kk3
href="http://eastyconsultants.com/contactus.html">Contact
Us</A> | <IMG height=8 alt=""
src="images/sitemaptop.gif" width=10> <A
class=kk3
href="http://eastyconsultants.com/sitemap.html">Sitemap</A>
</TD></TR>
<TR>
<TD align=middle>
<IMG height=152 alt=""
src="images/aboutus_img.jpg"
width=479>


</TD></TR></TBODY></TABLE></TD></TR>