Solved

How can I extend my table the full length of my div?

Posted on 2015-02-17
2
76 Views
Last Modified: 2015-02-18
Check out the screenshot below:

screenshot
Pretty, ain't it?

I want to extend the table within the div all the way to the end so the table and the div are flush.

How?

Here's my code and CSS:

HTML:

<div style="height:370px; width:690px; margin-top:25px; display:inline-block; text-align:center;float:left;">
<table class="csv_sample"> 
<tr> 
<td>&nbsp;</td> 
<th style="border-top-right-radius:5px;border-top-left-radius:5px; background-color:blue; color:#ffffff; font-weight:bold; font-size:18pt; width:150px;">7 Day<br>KPIs</strong></div></th> 
<td bgcolor="blue"><div align="center"><strong><FONT size="+2" COLOR="#FFFFFF">RAN<br>IA%</strong></div></td> 
<td bgcolor="blue"><div align="center"><strong><FONT size="+2" COLOR="#FFFFFF">1-SEER%</strong></div></td> 
<td bgcolor="blue"><div align="center"><strong><FONT size="+2" COLOR="#FFFFFF">LC%</strong></div></td>
<th style="border-top-right-radius:5px;border-top-left-radius:5px; background-color:blue; color:#ffffff; font-weight:bold; font-size:18pt;">SIP MOU</strong></div></th> 
<td>&nbsp;</td>
</tr> 

Open in new window


CSS:

table.csv_sample {
 box-shadow: 7px 7px 15px #e9e9e9;
 border-collapse:separate;
border-radius:6px;
-moz-border-radius:6px;
 margin:auto;
 width:100%;
border: 1px solid #d7d4d4;
 }
 

Open in new window


What do you think?
0
Comment
Question by:brucegust
2 Comments
 
LVL 11

Accepted Solution

by:
N R earned 500 total points
ID: 40615835
Get rid of your filler <td>.

http://gallitin.com/experts-exchange/brucegust/brucegust.php

<div style="height:370px; width:690px; margin-top:25px; display:inline-block; text-align:center;float:left;">
<table class="csv_sample">
<tr>
<th style="border-top-right-radius:5px;border-top-left-radius:5px; background-color:blue; color:#ffffff; font-weight:bold; font-size:18pt; width:150px;">7 Day<br>KPIs</strong></div></th>
<td bgcolor="blue"><div align="center"><strong><FONT size="+2" COLOR="#FFFFFF">RAN<br>IA%</strong></div></td>
<td bgcolor="blue"><div align="center"><strong><FONT size="+2" COLOR="#FFFFFF">1-SEER%</strong></div></td>
<td bgcolor="blue"><div align="center"><strong><FONT size="+2" COLOR="#FFFFFF">LC%</strong></div></td>
<th style="border-top-right-radius:5px;border-top-left-radius:5px; background-color:blue; color:#ffffff; font-weight:bold; font-size:18pt;">SIP MOU</strong></div></th>
</tr>

Open in new window

0
 

Author Comment

by:brucegust
ID: 40616415
Well, there you go!
0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Error on Add method 1 50
Problem with a CSS in a page 2 30
P tag not forcing line space 2 27
How to show span when clicked on? 10 19
Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…

805 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