I made a web page years ago in which I present buttons to view a video or to
download that video file. In some text explaining something about the size of
the video, I gave text parts a color (white) and a background color using:
<font color="#ffffff"><span style="background: #990099">800x450</span></font>
When I now go to this web page using Firefox the background color is not
shown.
For the buttons I have:
<style type="text/css">
@page { margin: 2cm }
p { margin-bottom: 0.25cm; line-height: 120% }
td p { margin-bottom: 0.25cm; line-height: 120% }
.button {
border: none;
color: white;
padding: 1px 4px; <!--15px 32px;-->
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}
.tekst {
border: none;
color: white;
padding: 1px 4px; <!--15px 32px;-->
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
background-color: #009900;
line-height:1.4;
}
.button1 {background-color: #000099;} /* Green */
.button2 {background-color: #006600;} /* Blue */
.button3 {background-color: #990099;} /* Purper */
</style>
In a table I use for a row :
<tr valign="top">
<td class="tekst"><br/>Bijeenkomst<br/>29 sep. 2024</td>
<td><a href="Bijeenkomst-20240929.mp4"><button class="button
button2">Kijken<br/>middel<br/>929M</button></a></td>
<td><a href="Bijeenkomst-20240929-1080p.mp4"><button class="button
button1">Kijken<br/>groot<br/>1,5G</button></a></td>
<td><a href="Bijeenkomst-20240929-450p.mp4"><button class="button
button3">Kijken<br/>klein<br/>278M</button></a></td>
<td><a href="Bijeenkomst-20240929.mp4" download="Video"><button
class="button button2">Download<br/>middel<br/>929M</button
></a></td>
<td><a href="Bijeenkomst-20240929-1080p.mp4" download="Video"><button
class="button button1">Download<br/>groot<br/>1,5G</b
utton></a></td>
<td><a href="Bijeenkomst-20240929-450p.mp4" download="Video"><button
class="button button3">Download<br/>klein<br/>278M</bu
tton></a></td>
</tr>
The text shown of this row on the page is black, should be white and the
background of the first element on the row is white and the background of the
buttons is light gray.
When pressing the button for viewing the largest video it is shown, but I used
to be able to select a position in the video to view from that position. Now
the video skips to the end and selecting a position is impossible.
Choosing the other two buttons to view those videos gives an error, something
like "No video with supported layout and MIME type found". The buttons for
downloading work as expected.
When I copy the index.html for this web page and the files mentioned in that
file in a folder (everything is in one folder) and use file://
<path_of_folder>index.html in Firefox all colors look good. I can view all
videos and I can select positions in those videos.
The only difference in these two cases is that the files go through apache to
Firefox or come directly from the disk.
In both cases I used Page Source in Firefox to download index.html. I compared
these files and apart from obvious differences in locations of the referenced
files, they are the same.
Any clues?
--
fr.gr.
Freek de Kruijf
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@xxxxxxxxxxxxxxxx
For additional commands, e-mail: users-help@xxxxxxxxxxxxxxxx
|