Solved

<table>

Posted on 2012-03-10
5
168 Views
Last Modified: 2012-03-11
Hi I have the following structure for my <table> tag
6 rows

row1 has 2 columns
row 2 has 2 columns
row 3 has 6 columns
row 4 has 6 columns
row 5 has 5 columns
row 6 has 5 columns

The problem i am having is, the columns are of different width. I want the columns to be aligned in each row. This is not happening.

I used colspan=5 Does not help for row 2 column 2.

Is there a better way to align columns with different widths?
0
Comment
Question by:genius_geek
  • 3
  • 2
5 Comments
 
LVL 8

Expert Comment

by:pdd1lan
ID: 37704736
<table>
    <tr>
          <td colspan="3"></td>
         <td colspan="3"></td>
   </tr>
<tr>
          <td colspan="3"></td>
         <td colspan="3"></td>
   </tr>
<tr>
          <td colspan="1"></td>
         <td colspan="1"></td>
         <td colspan="1"></td>
          <td colspan="1"></td>
         <td colspan="1"></td>
          <td colspan="1"></td>
   </tr>
<tr>
          <td colspan="1"></td>
         <td colspan="1"></td>
         <td colspan="1"></td>
          <td colspan="1"></td>
         <td colspan="1"></td>
          <td colspan="1"></td>
   </tr>
<tr>
          <td colspan="2"></td>
         <td colspan="1"></td>
         <td colspan="1"></td>
          <td colspan="1"></td>
         <td colspan="1"></td>
   </tr>

<tr>
          <td colspan="2"></td>
         <td colspan="1"></td>
         <td colspan="1"></td>
          <td colspan="1"></td>
         <td colspan="1"></td>
   </tr>
</table>
0
 

Author Comment

by:genius_geek
ID: 37704752
i tried that. I will tell you why it does not work.

row 2 has two input type=text (column1 and column2) each textbox with size is 25
row 4 has 6 textboxes, 1st with size 25, 2nd 3rd 4th with size 2, 5th and 6th with size 7

in the above mentioned case, r2c2 and r2c3 will be faaaaaar apart. how would you solve that?
0
 

Author Comment

by:genius_geek
ID: 37704758
also 1st and 2nd row is spilt as 1,5 and not 3,3
0
 
LVL 8

Accepted Solution

by:
pdd1lan earned 500 total points
ID: 37704774
I put row 2 and row 6 as you mentioned, and looks align up to me.  I misunderstand your question.
 
  <tr>
          <td colspan="1"><input type="textbox" name="t1" size="25"></td>
         <td colspan="5"><input type="textbox" name="t2" size="25"></td>
   </tr>
<tr>
          <td colspan="1"><input type="textbox" name="t2" size="25"></td>
         <td colspan="1"><input type="textbox" name="t2" size="2"></td>
         <td colspan="1"><input type="textbox" name="t2" size="2"></td>
          <td colspan="1"><input type="textbox" name="t2" size="2"></td>
         <td colspan="1"><input type="textbox" name="t2" size="2"></td>
          <td colspan="1"><input type="textbox" name="t2" size="7"></td>
   </tr>
<tr>
0
 
LVL 8

Expert Comment

by:pdd1lan
ID: 37704792
have to try to align the field to the left:

<style type="text/css">
  td {text-align:left;"}
</style>
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

911 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

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now