How to center a span inside a TD?

css, html, javascript

Solution

You can solve it with CSS , see here: http://jsfiddle.net/sMysu/6/ It is tricky workaround , but it works:

td[valign="top"] {
    display: block;
}

td[valign="top"][style="width: 15%"] {
    white-space: nowrap;
    display: table-cell;
}

Problem

I have a problem with a certain tag, grabbed from an external source. This code you will see is taken from another website, and you could also see a date (ex. 15 Juli Måndag) There is dates all over the page, how could I center them with just CSS? Tried with absolute positioning, which leads to have all dates over each other. Fiddle here. My html: ``` <div id="header"> <div class="schema"> <h1>Schema</h1> </div> <div class="back"><a id="back" href="index.html"></a> </div> </div> <div id="content"> <div class="content" style="margin-top:0px;"> <div class="article" style="text-align:center;"> <!-- Här skrivs det ut en massa saker --> </div> </div> </div> ``` My JS: ``` $(window).load(function () { //Fade $("#status").fadeOut(); $("#preloader").delay(350).fadeOut("slow"); }) grabShedule(); function grabShedule() { var url = "http://1life.se/scraper/Schedule.php"; //URL $.getJSON(url, function (response) { var html = response.scraped[0].html; //Answer $('.article').append(html); //Answer is appended to .article }); } ``` Check out my fiddle, I don't know how to approach this problem... How I want it:

Original source