Frage Breite von Bildern an Bildschirmauflösung anpassen

[marc999]

Hallo zusammen,
dies ist wohl schon ein bekanntes Thema, habe auch schon vieles versucht doch komme ich zu keinem brauchbaren Resultat, deshalb bitte ich um Hilfe.
Es geht drum ein Youtube Video und ein Bild nebeneinander darzustellen, welche sich jeweils an die verschiedenen Bildschirmgrößen anpassen sollten.

Hier der bisherige Code, nun blicke ich mit den Breiten nicht durch (width 100%, auto, oder oder)

<table border="0" cellpadding="10" cellspacing="1" style="text-align: center; width: 1150px;">
<tbody>
<tr>
<td>
<div>
<iframe allowfullscreen="" frameborder="0" height="210" src="//www.meinvideo" width="550">
</iframe>
</div>
</td>
<td>&nbsp;
</td>
<td><img alt="" src="https://www.meinbild.de/bild.jpg" style="height:220px; width:550px">
</td>
</tr>
</tbody>
</table>

Vielen Dank vorab

 

[MrMurphy]

Hallo

Dein Vorgehen ist grundsätzlich für die von dir gewünschte Darstellung nicht geeignet.

Ich würde zu diesem HTML

      <section class="multimedia">
         <figure>
            <img src="http://lorempixel.com/600/400/transport/5" alt="Porsche">
         </figure>
         <iframe src="https://www.youtube.com/embed/UsAkdNiYjCM" frameborder="0" allowfullscreen></iframe>
      </section>

dieses CSS verwenden

      .multimedia {
         max-width: calc(1200px + 4rem);
         display: flex;
      }
      .multimedia figure {
         margin: 1rem;
         flex-grow: 1;
         flex-shrink: 1;
         flex-basis: 1px;
      }
      .multimedia iframe {
         margin: 1rem;
         flex-grow: 1;
         flex-shrink: 1;
         flex-basis: 1px;
      }

Und gleich ein Beispiel zum direkten ausprobieren:

http://boratb.bplaced.net/index38.html

Gruss

MrMurphy

 

[marc999]

Hallo Mr Murphy,

ja da hast du wohl recht :)

Es funktioniert, Tausend Dank für deine Mühe, hat mir sehr geholfen.

Gruß
Marc