防止图像与表格的边框重叠?

时间:2018-07-11 18:31:58

标签: html css responsive-design

我目前正在测试如何创建新闻通讯。我做了一个模板。我对设计也很陌生。我已经制作了一张专辑发行表,但是它与我创建的边界不符。我怎样才能解决这个问题?

我在这里添加了代码。

此外,我想指出的是,我将CSS添加到html中,以便特定的新闻通讯网站可以接受该新闻通讯。尽管有人告诉我创建单独的html和css文件的另一种方法,但目前这是必须的。

<!DOCTYPE html>
<html>
<head>
  <title>NewsLetter Template</title>
  <style type="text/css" >
  body {
    border: 5px solid #ffff;
    max-width: 700px;
    padding: 20px;
    width: 80%;
    margin: 20px auto;

  }
  .img1 {
    width: 100%;
    height:auto;
    position: relative
  } 

  .img2 {
    width: 50px;
    height: 50px;
    position: relative
  }

  h2 { 
    background-color: red;
    text-align:"center";
    font-family: Helvetica; 
    font-size: 20px; 
    font-weight: bold; 
    text-transform: uppercase;
    color: white;
  }

  .performance {
    width: 250px;
  }

  p {
     font-family: Helvetica; 
    font-size: 20px; 
    color: black;

  }

  .performancetype {
    font-size: 20px;
    font-family: Helvetica; 

  }

  h3 {
    font-family: Helvetica;
    font-weight: 500;  
  }

  table {
    display:inline-block;
     width:"100%"; 
   
  }
  </style>
</head>
<body>

<!-- Header -->

     
    <div style="min-height: 100vh; position: relative; border: 5px red solid; text-align: center;">
        <a href="http://www.google.com">
        <img class="img1" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt="Sample"/></a>

      <div>

<!-- Icons -->
        <tr> 
        <td align="center">
          <a href="http://www.google.com">
            <img class="img2" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt=" Facebook" border="0"/>
          </a>
          
      
          <a href="http://google.com">
            <img class="img2" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt=" Twitter"border="0"/>
          </a> 
      
        
          <a href="http://google.com">
            <img class="img2" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt="YouTube" border="0"/>
          </a>
        </td>         
      </tr>

    </div>

  <br></br>

<div>
  <h2>Check Out New Releases In The Following Categories</h2>
</div>

<!-- NEW RELEASE CATEGORIES -->


<!-- BEGIN UPCOMING INSTORE//-->
<h2>Upcoming Instore Events</h2>

<!-- BEGIN IN STORE -->


<!-- PERFORMER IMAGE -->


<div>
  <h2> Breakout Specials & Releases </h2>
</div>

<table>

  <tr>   
                   
                  
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/LOVELYLP"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/Lovely250-250x250.jpg" 
            alt="LOVELYTHEBAND - FINDING IT PREORDER LP" title="LOVELYTHEBAND - FINDING IT PREORDER LP" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/LOVELYLP">LOVELYTHEBAND</a></h4>
              <h4><a href="http://vvinyl.com/shop/LOVELYLP">FINDING IT PREORDER LP</a></h4>
              <p>[ LP ] PREORDER FOR EVENT WRISTBAND</p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/LOVELYCD"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/Lovely250-250x250.jpg" 
            alt="LOVELYTHEBAND - FINDING IT PREORDER CD" title="LOVELYTHEBAND - FINDING IT PREORDER CD" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/LOVELYCD">LOVELYTHEBAND</a></h4>
              <h4><a href="http://vvinyl.com/shop/LOVELYCD">FINDING IT PREORDER CD</a></h4>
              <p>[ CD ] PREORDER FOR EVENT WRISTBAND</p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/602567572039"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/beatles-250x250.jpg" 
            alt="BEATLES - YELLOW SUBMARINE (PIC DISC)" title="BEATLES - YELLOW SUBMARINE (PIC DISC)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/602567572039">BEATLES</a></h4>
              <h4><a href="http://vvinyl.com/shop/602567572039">YELLOW SUBMARINE (PIC DISC)</a></h4>
              <p>[ New 7 inch Vinyl ] Limited edition 7-inch vinyl picture disc now available!</p>
            </div>
          </td>
      </tr>
      
      <tr>

          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/896308002842"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0619/clutch-250x250.JPG" 
            alt="CLUTCH - HOW TO SHAKE HANDS (PIC DISC)" title="CLUTCH - HOW TO SHAKE HANDS (PIC DISC)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/896308002842">CLUTCH</a></h4>
              <h4><a href="http://vvinyl.com/shop/896308002842">HOW TO SHAKE HANDS (PIC DISC)</a></h4>
              <p>[ New 7 inch Vinyl ] Picture disc now available!</p>
            </div>
          </td>
              
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/840588116126"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/devil-250x250.jpg" 
            alt="DEVILDRIVER - OUTLAWS TIL THE END V.1" title="DEVILDRIVER - OUTLAWS TIL THE END V.1" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/840588116126">DEVILDRIVER</a></h4>
              <h4><a href="http://vvinyl.com/shop/840588116126">OUTLAWS TIL THE END V.1</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/190758510026"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/townsend-250x250.jpg" 
            alt="DEVIN TOWNSEND - OCEAN MACHINE: LIVE AT ANCIENT ROMAN THEATRE PLOVDIV" title="DEVIN TOWNSEND - OCEAN MACHINE: LIVE AT ANCIENT ROMAN THEATRE PLOVDIV" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/190758510026">DEVIN TOWNSEND</a></h4>
              <h4><a href="http://vvinyl.com/shop/190758510026">OCEAN MACHINE: LIVE AT ANCIENT ROMAN THEATRE PLOVDIV</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>

     </tr>

      <tr>   
         <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/724596973523"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/goldfrapp-250x250.jpg" 
            alt="GOLDFRAPP - SILVER EYE (2CD/DELUXE)" title="GOLDFRAPP - SILVER EYE (2CD/DELUXE)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/724596973523">GOLDFRAPP</a></h4>
              <h4><a href="http://vvinyl.com/shop/724596973523">SILVER EYE (2CD/DELUXE)</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/727361445225"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/immortal-250x250.jpg" 
            alt="IMMORTAL - NORTHERN CHAOS GODS (WHITE/BLACK)" title="IMMORTAL - NORTHERN CHAOS GODS (WHITE/BLACK)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/727361445225">IMMORTAL</a></h4>
              <h4><a href="http://vvinyl.com/shop/727361445225">NORTHERN CHAOS GODS (WHITE/BLACK)</a></h4>
              <p>[ LP ] Indie exclusive black and white colored vinyl LP pressing!</p>
            </div>
          </td>
               
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/727361322021"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/immortal-250x250.jpg" 
            alt="IMMORTAL - NORTHERN CHAOS GODS" title="IMMORTAL - NORTHERN CHAOS GODS" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/727361322021">IMMORTAL</a></h4>
              <h4><a href="http://vvinyl.com/shop/727361322021">NORTHERN CHAOS GODS</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
      </tr>
      <tr>
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/190296955600"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/marr-250x250.jpg" 
            alt="JOHNNY MARR - CALL THE COMET (PURPLE)" title="JOHNNY MARR - CALL THE COMET (PURPLE)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/190296955600">JOHNNY MARR</a></h4>
              <h4><a href="http://vvinyl.com/shop/190296955600">CALL THE COMET (PURPLE)</a></h4>
              <p>[ LP ] Indie exclusive purple vinyl LP pressing!</p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/190758588728"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/lucifer-250x250.jpg" 
            alt="LUCIFER - LUCIFER II" title="LUCIFER - LUCIFER II" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/190758588728">LUCIFER</a></h4>
              <h4><a href="http://vvinyl.com/shop/190758588728">LUCIFER II</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/405053840102"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/perfect-250x250.jpg" 
            alt="PERFECT CIRCLE - EAT THE ELEPHANT (RED/BLUE)" title="PERFECT CIRCLE - EAT THE ELEPHANT (RED/BLUE)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/405053840102">PERFECT CIRCLE</a></h4>
              <h4><a href="http://vvinyl.com/shop/405053840102">EAT THE ELEPHANT (RED/BLUE)</a></h4>
              <p>[ LP ] Red and blue vinyl LP pressing!</p>
            </div>
          </td>
     </tr>
    
     <tr>
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/607618211523"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/murphy-250x250.jpg" 
            alt="PETER MURPHY - 5 ALBUMS" title="PETER MURPHY - 5 ALBUMS" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/607618211523">PETER MURPHY</a></h4>
              <h4><a href="http://vvinyl.com/shop/607618211523">5 ALBUMS</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/4050538388558"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/tiger-250x250.jpg" 
            alt="TIGER ARMY - DARK PARADISE (COLORED VINYL W/DL)" title="TIGER ARMY - DARK PARADISE (COLORED VINYL W/DL)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/4050538388558">TIGER ARMY</a></h4>
              <h4><a href="http://vvinyl.com/shop/4050538388558">DARK PARADISE (COLORED VINYL W/DL)</a></h4>
              <p>[ New 7 inch Vinyl ] </p>
            </div>
          </td>
                                   

      
      
   </tr>

</body>
</html>

运行时,新版本看起来像这样

Screenshot

我该怎么办?

先谢谢了。

2 个答案:

答案 0 :(得分:0)

让图像具有动态尺寸:

.img-responsive{
    width: 100%;
    height: auto;
}

它们将填充<td>的宽度100%(并且不再填充),并且高度将动态调整大小以保留原始的宽高比。对于矩形图像(例如您的示例中的Yellow Submarine相册)很有用。

答案 1 :(得分:0)

width: 100%应用于表格单元格内的那些图像。无论它们有多大,这将使它们完全适合表单元格:

td img {
  width: 100%;
}
<!DOCTYPE html>
<html>
<head>
  <title>NewsLetter Template</title>
  <style type="text/css" >
  body {
    border: 5px solid #ffff;
    max-width: 700px;
    padding: 20px;
    width: 80%;
    margin: 20px auto;

  }
  .img1 {
    width: 100%;
    height:auto;
    position: relative
  } 

  .img2 {
    width: 50px;
    height: 50px;
    position: relative
  }

  h2 { 
    background-color: red;
    text-align:"center";
    font-family: Helvetica; 
    font-size: 20px; 
    font-weight: bold; 
    text-transform: uppercase;
    color: white;
  }

  .performance {
    width: 250px;
  }

  p {
     font-family: Helvetica; 
    font-size: 20px; 
    color: black;

  }

  .performancetype {
    font-size: 20px;
    font-family: Helvetica; 

  }

  h3 {
    font-family: Helvetica;
    font-weight: 500;  
  }

  table {
    display:inline-block;
     width:"100%"; 
   
  }
  </style>
</head>
<body>

<!-- Header -->

     
    <div style="min-height: 100vh; position: relative; border: 5px red solid; text-align: center;">
        <a href="http://www.google.com">
        <img class="img1" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt="Sample"/></a>

      <div>

<!-- Icons -->
        <tr> 
        <td align="center">
          <a href="http://www.google.com">
            <img class="img2" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt=" Facebook" border="0"/>
          </a>
          
      
          <a href="http://google.com">
            <img class="img2" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt=" Twitter"border="0"/>
          </a> 
      
        
          <a href="http://google.com">
            <img class="img2" src="https://i.kym-cdn.com/entries/icons/original/000/003/338/320px--Insert_image_here-.svg.png" alt="YouTube" border="0"/>
          </a>
        </td>         
      </tr>

    </div>

  <br></br>

<div>
  <h2>Check Out New Releases In The Following Categories</h2>
</div>

<!-- NEW RELEASE CATEGORIES -->


<!-- BEGIN UPCOMING INSTORE//-->
<h2>Upcoming Instore Events</h2>

<!-- BEGIN IN STORE -->


<!-- PERFORMER IMAGE -->


<div>
  <h2> Breakout Specials & Releases </h2>
</div>

<table>

  <tr>   
                   
                  
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/LOVELYLP"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/Lovely250-250x250.jpg" 
            alt="LOVELYTHEBAND - FINDING IT PREORDER LP" title="LOVELYTHEBAND - FINDING IT PREORDER LP" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/LOVELYLP">LOVELYTHEBAND</a></h4>
              <h4><a href="http://vvinyl.com/shop/LOVELYLP">FINDING IT PREORDER LP</a></h4>
              <p>[ LP ] PREORDER FOR EVENT WRISTBAND</p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/LOVELYCD"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/Lovely250-250x250.jpg" 
            alt="LOVELYTHEBAND - FINDING IT PREORDER CD" title="LOVELYTHEBAND - FINDING IT PREORDER CD" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/LOVELYCD">LOVELYTHEBAND</a></h4>
              <h4><a href="http://vvinyl.com/shop/LOVELYCD">FINDING IT PREORDER CD</a></h4>
              <p>[ CD ] PREORDER FOR EVENT WRISTBAND</p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/602567572039"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/beatles-250x250.jpg" 
            alt="BEATLES - YELLOW SUBMARINE (PIC DISC)" title="BEATLES - YELLOW SUBMARINE (PIC DISC)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/602567572039">BEATLES</a></h4>
              <h4><a href="http://vvinyl.com/shop/602567572039">YELLOW SUBMARINE (PIC DISC)</a></h4>
              <p>[ New 7 inch Vinyl ] Limited edition 7-inch vinyl picture disc now available!</p>
            </div>
          </td>
      </tr>
      
      <tr>

          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/896308002842"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0619/clutch-250x250.JPG" 
            alt="CLUTCH - HOW TO SHAKE HANDS (PIC DISC)" title="CLUTCH - HOW TO SHAKE HANDS (PIC DISC)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/896308002842">CLUTCH</a></h4>
              <h4><a href="http://vvinyl.com/shop/896308002842">HOW TO SHAKE HANDS (PIC DISC)</a></h4>
              <p>[ New 7 inch Vinyl ] Picture disc now available!</p>
            </div>
          </td>
              
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/840588116126"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/devil-250x250.jpg" 
            alt="DEVILDRIVER - OUTLAWS TIL THE END V.1" title="DEVILDRIVER - OUTLAWS TIL THE END V.1" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/840588116126">DEVILDRIVER</a></h4>
              <h4><a href="http://vvinyl.com/shop/840588116126">OUTLAWS TIL THE END V.1</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/190758510026"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/townsend-250x250.jpg" 
            alt="DEVIN TOWNSEND - OCEAN MACHINE: LIVE AT ANCIENT ROMAN THEATRE PLOVDIV" title="DEVIN TOWNSEND - OCEAN MACHINE: LIVE AT ANCIENT ROMAN THEATRE PLOVDIV" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/190758510026">DEVIN TOWNSEND</a></h4>
              <h4><a href="http://vvinyl.com/shop/190758510026">OCEAN MACHINE: LIVE AT ANCIENT ROMAN THEATRE PLOVDIV</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>

     </tr>

      <tr>   
         <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/724596973523"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/goldfrapp-250x250.jpg" 
            alt="GOLDFRAPP - SILVER EYE (2CD/DELUXE)" title="GOLDFRAPP - SILVER EYE (2CD/DELUXE)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/724596973523">GOLDFRAPP</a></h4>
              <h4><a href="http://vvinyl.com/shop/724596973523">SILVER EYE (2CD/DELUXE)</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/727361445225"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/immortal-250x250.jpg" 
            alt="IMMORTAL - NORTHERN CHAOS GODS (WHITE/BLACK)" title="IMMORTAL - NORTHERN CHAOS GODS (WHITE/BLACK)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/727361445225">IMMORTAL</a></h4>
              <h4><a href="http://vvinyl.com/shop/727361445225">NORTHERN CHAOS GODS (WHITE/BLACK)</a></h4>
              <p>[ LP ] Indie exclusive black and white colored vinyl LP pressing!</p>
            </div>
          </td>
               
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/727361322021"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/immortal-250x250.jpg" 
            alt="IMMORTAL - NORTHERN CHAOS GODS" title="IMMORTAL - NORTHERN CHAOS GODS" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/727361322021">IMMORTAL</a></h4>
              <h4><a href="http://vvinyl.com/shop/727361322021">NORTHERN CHAOS GODS</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
      </tr>
      <tr>
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/190296955600"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/marr-250x250.jpg" 
            alt="JOHNNY MARR - CALL THE COMET (PURPLE)" title="JOHNNY MARR - CALL THE COMET (PURPLE)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/190296955600">JOHNNY MARR</a></h4>
              <h4><a href="http://vvinyl.com/shop/190296955600">CALL THE COMET (PURPLE)</a></h4>
              <p>[ LP ] Indie exclusive purple vinyl LP pressing!</p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/190758588728"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/lucifer-250x250.jpg" 
            alt="LUCIFER - LUCIFER II" title="LUCIFER - LUCIFER II" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/190758588728">LUCIFER</a></h4>
              <h4><a href="http://vvinyl.com/shop/190758588728">LUCIFER II</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/405053840102"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/perfect-250x250.jpg" 
            alt="PERFECT CIRCLE - EAT THE ELEPHANT (RED/BLUE)" title="PERFECT CIRCLE - EAT THE ELEPHANT (RED/BLUE)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/405053840102">PERFECT CIRCLE</a></h4>
              <h4><a href="http://vvinyl.com/shop/405053840102">EAT THE ELEPHANT (RED/BLUE)</a></h4>
              <p>[ LP ] Red and blue vinyl LP pressing!</p>
            </div>
          </td>
     </tr>
    
     <tr>
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/607618211523"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/murphy-250x250.jpg" 
            alt="PETER MURPHY - 5 ALBUMS" title="PETER MURPHY - 5 ALBUMS" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/607618211523">PETER MURPHY</a></h4>
              <h4><a href="http://vvinyl.com/shop/607618211523">5 ALBUMS</a></h4>
              <p>[ CD ] </p>
            </div>
          </td>
                                   
          <td width="25%" style="font-family: Helvetica, sans-serif; font-size: 10px;" align="center" valign="top">
            <div class="image"><a href="http://vvinyl.com/shop/4050538388558"><img src="http://vvinyl.com/shop/image/cache/catalog/2018/0703/tiger-250x250.jpg" 
            alt="TIGER ARMY - DARK PARADISE (COLORED VINYL W/DL)" title="TIGER ARMY - DARK PARADISE (COLORED VINYL W/DL)" class="img-responsive" /></a></div>
            <div class="caption">
              <h4><a href="http://vvinyl.com/shop/4050538388558">TIGER ARMY</a></h4>
              <h4><a href="http://vvinyl.com/shop/4050538388558">DARK PARADISE (COLORED VINYL W/DL)</a></h4>
              <p>[ New 7 inch Vinyl ] </p>
            </div>
          </td>
                                   

      
      
   </tr>

</body>
</html>