Um dos propósitos de montar um site responsivo é garantir que todo o conteúdo se adapte facilmente aos diferentes tamanhos de telas, de smartphones e tablets a monitores. Só que isso pode se tornar uma dor de cabeça quando parte do conteúdo é um vídeo de fontes externas, como o YouTube, que vem com um código pronto e que não pode ser alterado.
Isso aconteceu comigo quando estava montando o novo layout do blog e, depois de um tempo pesquisando e testando, encontrei um código que adapta o player ao site. É útil principalmente se você usa WordPress.
span[class*="embed-"] { position: relative; padding-top: 28.125%; padding-bottom: 28.125%; height: 0; overflow: hidden; margin: 0; } span[class*="embed-"] iframe, span[class*="embed-"] object, span[class*="embed-"] embed { position: absolute; top:0; left: 0; width: 100%; height: 100%; margin: 0; }
Caso tenha algum problema com as margens, principalmente entre parágrafos, você pode tentar ajustar o parâmetro overflow e a margem no span (o primeiro do código). Não altere os demais parâmetros a menos que você saiba o que está fazendo, caso contrário isso pode interferir na exibição ou até no funcionamento do player.