<table> inside <div> won't work IN dreamwaever

HELLO..

I've been designing web pages in dreamwaever 8 and i have put a table inside a div. No matter what i try the table wont scale accordingly inside the div. It always scales along the div. its width is 200px but automatically scale up to somewhere around 500px.. :(
If i remove div tag, then the table scales without any trouble.
what can i do for this?

thank you...

Virangya

Junior Poster

122 posts since Apr 2010

Reputation Points: 10

Solved Threads: 0

2 Years Ago

0

It won't work outside dreamweaver either.

Add a style for div tags:

div {display: table-cell;}

Then the div will expand itself to fit the table inside.

MidiMagic

Nearly a Senior Poster

3,319 posts since Jan 2007

Reputation Points: 730

Solved Threads: 182

2 Years Ago

0

Thankx for the reply..!
the thing is, my table width is smaller than the div. but still it scales larger...
also the css style i applied does not work for the table.

table{
background-color:#003333;
}

i tried applying your code, but still its the same... and here i attached a screen shot of my design.

Attachments

Virangya

Junior Poster

122 posts since Apr 2010

Reputation Points: 10

Solved Threads: 0

2 Years Ago

0

First, set your CSS like this.

div#kol {width:200px ; height:auto:}
table {width:100%;}

As your div is 200px width. hope this will solve.

Rajib Ganguly

Newbie Poster

14 posts since Jun 2010

Reputation Points: 10

Solved Threads: 5

2 Years Ago

0

you mean... the id of the div tag you have taken as kol right???

Virangya

Junior Poster

122 posts since Apr 2010

Reputation Points: 10

Solved Threads: 0

2 Years Ago

0

yeah! working??

Rajib Ganguly

Newbie Poster

14 posts since Jun 2010

Reputation Points: 10

Solved Threads: 5

2 Years Ago

0

Thanks for your reply!
No, it does not work... Your code stretches my div tag along the table... But thats not the way i want it to work.. i need to change the width of the table, keeping the div tags width same. :confused::'(:-/

Virangya

Junior Poster

122 posts since Apr 2010

Reputation Points: 10

Solved Threads: 0

2 Years Ago

Show Comments

1

Here's a small table inside a div. Created in Dreamweaver CODE view. I added some extra CSS to show different methods of formatting the table cells. Hope this helps.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#container {
	height: 300px;
	width: 500px;
	border: thin dotted #0F0;
}
#small_table {
	float: left;
	width: 200px;
	border: thin solid #CCC;
	padding-top: 20px;
	padding-left: 20px;
}
#small_table tr {
	padding: .5em;
	height: 2em;
}
#small_table td {
	padding: 2%;
	width: 33.3%;
}
-->
</style>
</head>
<body>
<div id="container"><p style="margin: 0; float: right;">div id #container 500px X 300px</p>
  <table id="small_table">
    <caption>
    table id #small_table
    </caption>
    <tr>
      <td>r1c1</td>
      <td>r1c2</td>
      <td>r1c3</td>
    </tr>
    <tr>
      <td>r2c1</td>
      <td>r2c2</td>
      <td>r2c3</td>
    </tr>
    <tr>
      <td>r3c1</td>
      <td>r3c2</td>
      <td>r3c3</td>
    </tr>
    <tr>
      <td>r4c1</td>
      <td>r4c2</td>
      <td>r4c3</td>
    </tr>
    <tr>
      <td>r5c1</td>
      <td>r5c2</td>
      <td>r5c3</td>
    </tr>
  </table>
</div>
</body>
</html>

tinimic

Newbie Poster

13 posts since May 2010

Reputation Points: 10

Solved Threads: 7

2 Years Ago

0

this do works thanx!
but, unfortunately...
my design is totally based on div tags... there is another parent div tag, when i remove that parent div. your code works. But i need to keep that div tag also... i can only hope... there is a solution for this parent div...

thanx a lot all of you..!

Virangya

Junior Poster

122 posts since Apr 2010

Reputation Points: 10

Solved Threads: 0

1 Year Ago

0

yes u can also use z-index for divs

karol33

Junior Poster

102 posts since Feb 2010

Reputation Points: 11

Solved Threads: 8

1 Year Ago

0

If you could post a sample of your markup and style it would be a lot easier to determine where any problem starts. You might want to look at the w3c box model recommendations at http://www.w3.org/TR/CSS2/box.html .

tinimic

Newbie Poster

13 posts since May 2010

Reputation Points: 10

Solved Threads: 7

<table> inside <div> won't work IN dreamwaever

This article has been dead for over three months