Question

All I want, is for .TableH to be centered horizontally. I'm usually pretty decent at working small things like this out, but this is driving me nuts. I don't use tables as much as I should so if someone could help me, that would be great.

HTML:

    <div id="Contactbody">
    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d6118.82203107468!2d-74.17584896118852!3d39.932195088535714!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x8c86de105986c5c3!2sEaglespeed+Oil+%26+Lube!5e0!3m2!1sen!2sus!4v1395432683622" frameborder="0" style="border:0"></iframe>
    <table>
        <tbody>
            <tr>
                <td class="TableH">Hours</td>
            </tr>
            <tr>
                <td class="Day">Mon</td>
                <td class="Hours">8 - 6</td>
            </tr>
            <tr>
                <td class="Day">Tues</td>
                <td class="Hours">8 - 6</td>
            </tr>
            <tr>
                <td class="Day">Wed</td>
                <td class="Hours">8 - 7</td>
            </tr>
            <tr>
                <td class="Day">Thur</td>
                <td class="Hours">8 - 6</td>
            </tr>
            <tr>
                <td class="Day">Fri</td>
                <td class="Hours">8 - 6</td>
            </tr>
            <tr>
                <td class="Day">Sat</td>
                <td class="Hours">7:30 - 3:30</td>
            </tr>
            <tr>
                <td class="Day">Sun</td>
                <td class="Hours">8:30 - 1</td>
            </tr>
        </tbody>
    </table>
</div>

CSS:

#Contactbody {
position: absolute;
display: none;
margin: 8% 0 0 15%;
width: 70%;
height: auto;
border-left: 4px solid #ffe168;
}

#Contactbody iframe {
    display: block;
    float: left;
    margin-left: 2.5%;
    width: 40%;
    height: auto;
}

#Contactbody table {
    float: right;
    margin-right: 5%;
    width: 25%;
    font-family: Aleygra Sans SC, Maven Pro, Verdana, Arial;
}

.TableH {
color: #0b0658;
vertical-align: middle;
font-weight: bold;
    text-align: center;
}
Was it helpful?

Solution

Your cell is only spanning one column, you probably want:

<td class="TableH" colspan="2">Hours</td>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top