Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to place a horizontal rule under table header?

I am trying to place a horizontal rule <hr /> underneath a table header <th> with close to no success. Is this possible without hacks?

Here is the HTML I'm using and what I've tried to far

<div id="epd" class="editProfileDiv">    
    <form>
        <table align="center">
            <th> Profile Information </th>
            <tr> 
                 <hr />                  
            </tr>
            <tr>
                <td>Name: </td>        
                <td><input id="name" name="name" value="<?php echo $_SESSION['name'];?>" placeholder=" Jon Doe" type="text" class=""></td>
            </tr> 

That code appears like this in the browser

----<hr/> is here----
 Profile Information
 Name:  <text input>

Then I tried this

<th> Profile Information </th>
<hr />                  
<tr><td> something here </td></tr>

Which has the exact same outcome, the <hr/> is on top of the table header

and this...

<tr> 
  <td> <hr /> </td> // If I only use one it only spans half the width of the table
  <td> <hr /> </td>                  
</tr>

which places the <hr/> in the correct place but there is obviously a gap between them which is not what I want.

Now I know I can just not use a table header, and use a regular paragraph or any text for that matter and style it however I want. At this point it's just the principal because this is bugging me. So again, the question: Is this possible?

like image 626
i_me_mine Avatar asked Sep 02 '25 15:09

i_me_mine


1 Answers

Try this:

<tr> 
  <td colspan="2"> <hr /> </td>      
</tr>
like image 114
j08691 Avatar answered Sep 05 '25 05:09

j08691