View Cart | View Account | Help
Order by phone: 800-880-2592
Check out our favorite NEW ARRIVALS
Need it fast? Order before 4pm Eastern and your order ships SAME DAY.

All times are UTC - 5 hours




Post new topic Reply to topic  [ 5 posts ] 
Author Message
 Post subject: Aligning a table in the center of a page
PostPosted: Tue Jun 19, 2012 10:19 am 
User avatar
Offline
born to perform.

Joined: 17 May 2009
Posts: 1300
Location: New Jersey
I'm trying to vertically align a table in the middle of a webpage. No matter what I do for some reason I can't do it. Can someone please tell me how to align a to align a table in the middle of the page?


Top
 Profile  
 
 Post subject: Re: Aligning a table in the center of a page
PostPosted: Sat Jun 30, 2012 8:51 am 
Offline
born to perform.

Joined: 18 Jan 2008
Posts: 1329
Location: Sydney
Assuming your html coding. In your css style sheet place the below code under your heading

margin: 0 auto;

E.g:
#header {
width: 960px;
height: 167px;
margin: 0 auto;
}

You could try margin-left and margin-right and place it but that would be a pain in the [edited]


Top
 Profile  
 
 Post subject: Re: Aligning a table in the center of a page
PostPosted: Sun Jul 01, 2012 5:19 pm 
User avatar
Offline
born to perform.

Joined: 10 Aug 2002
Posts: 1917
Location: Colorado
Code:
<div align="center" style="position: absolute; top: 50%; right: 50%">
    <table>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
        <tr>
            <td>7</td>
            <td>8</td>
            <td>9</td>
        </tr>
    </table>
</div>


Top
 Profile  
 
 Post subject: Re: Aligning a table in the center of a page
PostPosted: Wed Aug 01, 2012 1:29 am 
User avatar
Offline
born to perform.

Joined: 28 Dec 2002
Posts: 4064
Location: London, England
Orcishorde, that will only align the table horizontally, not vertically.

The common way around this sort of thing is to wrap your table inside another single-celled table, and set on that parent cell

Code:
vertical-align: middle;

But web purists hate that because you're adding unnecessary elements to your page for layout purposes, when HTML should be all about content (CSS is for layout).

If you don't care about Internet Explorer, you can use some other element instead of a table, and use

Code:
display: table-cell;
vertical-align: middle;

or there's something called the flexible box model that will let you do this sort of thing, but neither IE nor Chrome support it.

There are other ways to do this sort of thing, but they require that you either know the height of the parent element, or the height of the content you're centring.

Search on stackoverflow.com


Top
 Profile  
 
 Post subject: Re: Aligning a table in the center of a page
PostPosted: Wed Oct 03, 2012 6:36 pm 
User avatar
Offline
Penguin

Joined: 13 Dec 2004
Posts: 326
Location: Hattiesburg, MS or Provo, UT Depending on the season.
If I could see the code you're working with I'd be glad to help. Also do you want it centered solely horizontally, vertically, or both? That changes the answer as you can already see. But seeing your code will help tremendously, so if you could provide a snippet that would be great. Thanks!


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 5 posts ] 

All times are UTC - 5 hours


Who is online

Users browsing this forum: No registered users and 1 guest


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Powered by phpBB © 2009 Penguin Magic, Inc.