DBから出力させたリンク画像をCSSで拡大する方法

前提・実現したいこと

PHP初心者ですご教授お願いします。
データベースにはサーバーに置いてある画像パスとリンク先のURLが入っていて、そこから出力させてCSSでリンクの上にカーソルがあうと画像が表示されるというものを実現させたいです。

発生している問題・エラーメッセージ

通常のコードなら実現できますが、DBから出力させているリンクには対応されない。

該当のソースコード

						<?php  
						
                          while($row = mysqli_fetch_array($result))  
                          {  
                               echo '  
                               <tr>  
                                    <td>'.$row["id"].'</td>  
									<td><a href="'.$row["url"].'" class="p"><img src="'.$row["img_url"].'"></a></td>
                               </tr>  
                               ';  
                          }  
                          ?>

試したこと

通常のHTMLコードならうまくいきますが、DBから出力させた画像はうまくいきません。

a.p:hover {
    position: relative;
    text-decoration: none;
}
a.p span {
    display: none;
    position: absolute;
    top: 1em;
    left: 0;
}
a.p:hover span {
    border: none;
    display: block;
    width: 210px;
}

<a href="#" class="p">犬<span><img src="/inu.jpg" alt="犬"></span></a>

行動規範の内容に同意します

回答2件

ベストアンサー

いったんPHPを頭から切り離してください。
なぜならあくまでPHPは文字列を出力しているだけであり、
正しくHTMLが出力されていればあとはHTMLとCSSの仕事です。
つまり想定通りできないのは、まず正しいHTMLが出力されていないことが疑われます。
ブラウザに表示した後「ソースを表示」でhtmlを確認してください。
HTMLで直接書いた場合と何か違いがあるはずです。

現在の提示内容だけだと「うまくいかない」だけでは何が起きているか質問者さんにしか分かりません。
まず起きている現象を整理し、正しいhtml、想定通りのhtmlが出力されているかどうか確認してください。

それが確認できたら、画像のパスは合っているか、CSSは正しく読み込めているか　の確認です。
飛ばしたりせず1つ1つ確実に確認していってください。

投稿2018/08/05 12:51