podlove / podlove-web-player

Podlove Web Player is a Podcast-optimized, HTML5-based audio player based on VueJS.
https://docs.podlove.org/podlove-web-player/
Other
353 stars 68 forks source link

chapter table misaligned in Twenty Fifteen #215

Closed katrinleinweber closed 7 years ago

katrinleinweber commented 9 years ago

I know you said several times that theme problems should be taken to the theme developers, but since this is the new default theme in WP4.1... ;-) It causes overly wide "Start time"- and "Duration"-columns, at the cost of the chapter titles. Apparently independent of screen width, because it looks almost the same on a 1920px wide monitor (screenshot) and at 1024px.

podlove-webplayer-twenty-fifteen-table-misaligned

katrinleinweber commented 9 years ago

Hier noch ein paar reale Beispiele: http://www.physikalischesoiree.at/archives/2967 http://www.bienenpodcast.at/bg008-imkereiausbildung/ http://www.lobundtadel.eu/lut028/

plutonik-a commented 9 years ago

Hi Katrin,

The bug is caused by the WP theme 'twentyfifteen'

/wp-content/themes/twentyfifteen/style.css?ver=4.1

lines 397 - 411

table,
th,
td {
    border: 1px solid #eaeaea;
    border: 1px solid rgba(51, 51, 51, 0.1);
}

table {
    ...
    table-layout: fixed; /* Prevents HTML tables from becoming too wide */
    ...
}

These styles need to be overridden, as they cause fixed columns in tables with highlighted borders. For those who are running out of patience for that bug to be fixed, I recommend to copy&paste following lines as a quick fix:

table,
th,
td {
    border: none;
}

table { 
    table-layout: auto; 
}

We are still busy on releasing our next player version, but hoping to fix that bug quite soon as a proper solution for all users.