2017-06-01 15 views
0

グリッドのようなギャラリーにインラインブロック要素としてイメージがあり、コードのある点では、基本的には、が取られた。CSS:最後に行がある場合、要素の前に改行があります

問題は、翌年の最初のイメージが行の最初の要素として配置され、アンカー要素が前の行に残っている場合です。私がしたいことは、アンカー要素を次の要素(画像)に貼り付けることです。

私はCSSとJSにオープンしています。私はこれを行うより良い方法があることを認識していますが、HTMLコードを変更することは、より大きな構造の一部であり、わずかな変更でも他のスクリプトが失敗する可能性があるため、オプションではありません。

img { 
 
    display: inline-block; 
 
    width: 120px; 
 
    height: 250px; 
 
} 
 

 
div { 
 
    margin: 0; 
 
    padding: 0; 
 
    width: 0; 
 
    height: 0; 
 
    visibility: hidden; 
 
}
<html> 
 

 
<head> 
 
</head> 
 

 
<body> 
 
    <button href="#2015">2015</button> 
 
    <button href="#2016">2016</button> 
 

 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <div id="2015"></div> 
 
    <!-- Anchor element --> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <div id="2016"></div> 
 
    <!-- Anchor element --> 
 
</body> 
 

 
</html>

答えて

1

このコードのすべてのアンカーにブレークを引き起こす

img { 
 
    display: inline-block; 
 
    width: 120px; 
 
    height: 250px; 
 
} 
 

 
div { 
 
    margin: 0; 
 
    padding: 0; 
 
    width: 0; 
 
    height: 0; 
 
    visibility: hidden; 
 
}
<html> 
 

 
<head> 
 

 
</head> 
 

 
<body> 
 
    <a href="#2015">2015</a> 
 
    <a href="#2016">2016</a><br/> 
 

 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."><br/> 
 
    <div id="2015"></div> 
 
    <!-- Anchor element --> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."> 
 
    <img src="..." alt="..."><br/> 
 
    <div id="2016"></div> 
 
    <!-- Anchor element --> 
 
</body> 
 

 
</html>

+0

を試してみてください。私がしようとしているのは、アンカー要素が最後の行である場合のみです。 – nemoneminem

+0

イメージ最後のHTMLタグを使用
と次の行。 –

+0

1.同じ問題。アンカーが行の最後の要素でなくても、ブレークします。 2.私が言ったように、HTMLの変更はオプションではありません。 ありがとうございます。 – nemoneminem

関連する問題