www.webdeveloper.com
Results 1 to 3 of 3

Thread: re-size table

  1. #1
    Join Date
    Aug 2010
    Posts
    2

    re-size table

    Hello averyone. I need your help. I try to make the resize table like this
    Code:
    <html>
    <head>
    	<style>
    		.tableview{
    			border-collapse: collapse;
    		}
    		
    		.cellview{
    			border: 1px solid rgb(0,0,0);
    		}
    		.cellview-inner{
    			height: 34px;
    		}
    		.kix-boxview{
    			left: px;
    			top: 9px;
    		}
    		.boxview-content{
    			width: 141px;
    			padding: 7px;
    		}
    		.lineview{
    			height: 20px;
    			direction: ltr;
    			text-align: left;
    		}
    		.lineview-content{
    			margin-left: 0px;
    			padding-top: 0px;
    		}
    		.lineview-content SPAN{
    			font-size: 11pt;
    			font-family: Arial;
    			color: rgb(0,0,0);
    			background-color: transparent;
    			font-weight: normal;
    			font-style: normal;
    			text-decoration: none;
    			vertical-align: baseline;
    		}
    		div.cDrag div {
    		background: repeat scroll 0 0 transparent;
    		cursor:col-resize;
    		display:block;
    		float:left;
    		height:24px;
    		position:absolute;
    		width:5px;
    		border: 1px solid rgb(0,0,0);
    		}
    	</style>
    </head>
    	<body>
    	<div class="cDrag" style="top: 27px;">
    		<div style="height: 110px; left: 163px;"></div>
    		<div style="height: 110px; left: 321px;"></div>
    		<div style="height: 110px; left: 479px;"></div>
    	</div>
    		<table class="tableview">
    			<tbody>
    				<tr>
    					<td class="cellview">
    						<div class="cellview-inner">
    							<div class="kix-boxview">
    								<div class="boxview-content">
    									<div class="lineview">
    										<div class="lineview-content">
    											<span>текст</span>
    										</div>
    									</div>
    								</div>
    							</div>
    						</div>
    					</td>
    					<td class="cellview">
    						<div class="cellview-inner">
    							<div class="kix-boxview">
    								<div class="boxview-content">
    									<div class="lineview">
    										<div class="lineview-content">
    											<span>текст</span>
    										</div>
    									</div>
    								</div>
    							</div>
    						</div>
    						</td>
    					<td class="cellview">
    						<div class="cellview-inner">
    							<div class="kix-boxview">
    								<div class="boxview-content">
    									<div class="lineview">
    										<div class="lineview-content">
    											<span>текст</span>
    										</div>
    									</div>
    								</div>
    							</div>
    						</div>
    					</td>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    												<span>текст</span>
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    				</tr>
    					<tr>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    												<span>текст</span>
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    												<span>текст</span>
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    												<span>текст</span>
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    					</tr>
    					<tr>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content">
    												<span>текст</span>
    											</div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    							<td class="cellview">
    								<div class="cellview-inner">
    									<div class="kix-boxview">
    										<div class="boxview-content">
    											<div class="lineview">
    												<div class="lineview-content">	
    													<span>текст</span>
    												</div>
    											</div>
    										</div>
    									</div>
    								</div>
    							</td>
    						<td class="cellview">
    							<div class="cellview-inner">
    								<div class="kix-boxview">
    									<div class="boxview-content">
    										<div class="lineview">
    											<div class="lineview-content"></div>
    										</div>
    									</div>
    								</div>
    							</div>
    						</td>
    					</tr>
    			</tbody>
    		</table>
    	</body>			
    </html>
    to resize i used 3 div tags, i need to wtite handler, that will capture the mouse and move it to change the width of the columns in a table.
    thx.

  2. #2
    Join Date
    Apr 2010
    Location
    Salem,Ma
    Posts
    623
    could you explain what you are trying to do in more detail please

  3. #3
    Join Date
    Aug 2010
    Posts
    2
    i want to make resizeble table, such as word table. Сolumns of the table should resize.
    If you open my html you will see table.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles