Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

HTML & CSS Extra DIV created underneath amazon image embed

B

b3pot6

Coder
Hi,

I'm wondering if anyone can help me with a problem I'm having.

Whenever I embed a product image from Amazon I get what appears to be an additional div with black borders beneath it.

Does anyone know why this happens and how I can get rid of it?
 

Attachments

  • Untitled-1.jpg
    Untitled-1.jpg
    24.6 KB · Views: 2
Sort by date Sort by votes
BGB said:
Post the code.
Click to expand...
[CODE lang="html" title="Html"]<div class="prod">
<a href="https://www.amazon.com/Kotobuki-120-932-Four-Seasons-Sake/dp/B004AE2078?keywords=sake+sets&qid=1555698446&refinements=p_72%3A2661618011&rnid=2661617011&s=gateway&sr=8-3&linkCode=li3&tag=jpn0a-20&linkId=316063b086ed5a0c9c9e3c8578e18ea3&language=en_US&ref_=as_li_ss_il" target="_blank" rel="noopener"><img border="0" src="//ws-na.amazon-adsystem.com/widgets/q?_encoding=UTF8&ASIN=B004AE2078&Format=_SL250_&ID=AsinImage&MarketPlace=US&ServiceVersion=20070822&WS=1&tag=jpn0a-20&language=en_US" ></a><img src="https://ir-na.amazon-adsystem.com/e/ir?t=jpn0a-20&language=en_US&l=li3&o=1&a=B004AE2078" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
</div>[/CODE]

[CODE title="Css"].prod { width:30%; height:30%; float:left; margin-right:30px;}[/CODE]
 
Upvote 0 Downvote
BGB said:
It is not showing any blank image in my localhost. Can you make a small full html page where same blank space appear and post here.
Click to expand...
Code: 
<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="profile" href="http://gmpg.org/xfn/11">
<title>Japanese Woodblock Prints: The Ultimate Guide &#8211; MoreJapanPlease</title>
<meta name='robots' content='max-image-preview:large' />
<!-- Grow Social by Mediavine v.1.18.2 https://marketplace.mediavine.com/grow-social-pro/ -->
<meta property="og:locale" content="en_US"/>
<meta property="og:type" content="article" />
<meta property="og:title" content="Japanese Woodblock Prints: The Ultimate Guide" />
<meta property="og:description" content="Home // Culture // Japanese Woodblock Prints The most popular ukiyo-e print in history - The Great Wave Off Kanagawa (1831) by Katsushika Hokusai. From beautiful women, picturesque landscapes, and ghoulish folklore to highly imaginative" />
<meta property="og:url"    content="https://localhost/mjp/2021/06/11/hello-world/" />
<meta property="og:site_name" content="MoreJapanPlease" />
<meta property="og:updated_time" content="2021-06-16T15:43:26+00:00" />
<meta property="article:published_time" content="2021-06-11T13:28:32+00:00" />
<meta property="article:modified_time" content="2021-06-16T15:43:26+00:00" />
<meta property="og:image" content="https://localhost/mjp/wp-content/uploads/2021/06/Tsunami_by_hokusai_19th_century.jpg" />
<meta property="og:image:width" content="900" />
<meta property="og:image:height" content="605" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Japanese Woodblock Prints: The Ultimate Guide" />
<meta name="twitter:description" content="Home // Culture // Japanese Woodblock Prints The most popular ukiyo-e print in history - The Great Wave Off Kanagawa (1831) by Katsushika Hokusai. From beautiful women, picturesque landscapes, and ghoulish folklore to highly imaginative" />
<meta name="twitter:image" content="https://localhost/mjp/wp-content/uploads/2021/06/Tsunami_by_hokusai_19th_century.jpg" />
<!-- Grow Social by Mediavine v.1.18.2 https://marketplace.mediavine.com/grow-social-pro/ -->
<link rel='dns-prefetch' href='//s.w.org' />
<link rel='stylesheet' id='dpsp-frontend-style-pro-css'  href='https://localhost/mjp/wp-content/plugins/social-pug/assets/dist/style-frontend-pro.1.18.2.css?ver=1.18.2' type='text/css' media='all' />
<link rel='stylesheet' id='wp-bootstrap-starter-bootstrap-css-css'  href='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/inc/assets/css/bootstrap.min.css?ver=5.7.2' type='text/css' media='all' />
<link rel='stylesheet' id='wp-bootstrap-starter-fontawesome-cdn-css'  href='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/inc/assets/css/fontawesome.min.css?ver=5.7.2' type='text/css' media='all' />
<link rel='stylesheet' id='wp-bootstrap-starter-style-css'  href='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/style.css?ver=5.7.2' type='text/css' media='all' />
<script type='text/javascript' src='https://localhost/mjp/wp-includes/js/jquery/jquery.min.js?ver=3.5.1' id='jquery-core-js'></script>
<script type='text/javascript' src='https://localhost/mjp/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>
<!--[if lt IE 9]>
<script type='text/javascript' src='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/inc/assets/js/html5.js?ver=3.7.0' id='html5hiv-js'></script>
<![endif]-->
<link rel="https://api.w.org/" href="https://localhost/mjp/wp-json/" /><link rel="alternate" type="application/json" href="https://localhost/mjp/wp-json/wp/v2/posts/1" /><link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://localhost/mjp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://localhost/mjp/wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 5.7.2" />
<link rel="canonical" href="https://localhost/mjp/2021/06/11/hello-world/" />
<link rel='shortlink' href='https://localhost/mjp/?p=1' />
<link rel="alternate" type="application/json+oembed" href="https://localhost/mjp/wp-json/oembed/1.0/embed?url=https%3A%2F%2Flocalhost%2Fmjp%2F2021%2F06%2F11%2Fhello-world%2F" />
<link rel="alternate" type="text/xml+oembed" href="https://localhost/mjp/wp-json/oembed/1.0/embed?url=https%3A%2F%2Flocalhost%2Fmjp%2F2021%2F06%2F11%2Fhello-world%2F&#038;format=xml" />
<style type="text/css" data-source="Grow Social by Mediavine"></style><link rel="pingback" href="https://localhost/mjp/xmlrpc.php">    <style type="text/css">
        #page-sub-header { background: #fff; }
    </style>
    </head>

<body class="post-template-default single single-post postid-1 single-format-standard logged-in">


<div id="page" class="site">
    <a class="skip-link screen-reader-text" href="#content">Skip to content</a>
        <header id="masthead" class="site-header navbar-static-top navbar-light" role="banner">
        <div class="container">
            <nav class="navbar navbar-expand-xl p-0">
                <div class="navbar-brand">
                                            <a class="site-title" href="https://localhost/mjp/">MoreJapanPlease</a>
                    
                </div>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#main-nav" aria-controls="" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div id="main-nav" class="collapse navbar-collapse justify-content-end"><ul id="menu-menu" class="navbar-nav"><li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-28" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-28 nav-item"><a title="Culture" href="https://morejapanplease.com/japanese-culture/" class="nav-link">Culture</a></li>
<li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-29" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-29 nav-item"><a title="Food" href="https://food.com" class="nav-link">Food</a></li>
<li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-30" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-30 nav-item"><a title="Travel" href="https://trave.com" class="nav-link">Travel</a></li>
<li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-34" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-34 nav-item"><a title="Where to stay" href="https://where.com" class="nav-link">Where to stay</a></li>
<li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-31" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-31 nav-item"><a title="Products" href="https://prd.com" class="nav-link">Products</a></li>
<li itemscope="itemscope" itemtype="https://www.schema.org/SiteNavigationElement" id="menu-item-32" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-32 nav-item"><a title="Contact" href="https://cont.com" class="nav-link">Contact</a></li>
</ul></div>
            </nav>
        </div>
    </header><!-- #masthead -->
        <div id="content" class="site-content">
        <div class="container">
            <div class="row">
                

    <section id="primary" class="content-area col-sm-9">
        <div id="main" class="site-main" role="main">

        <header class="entry-header">
                <h1 class="entry-title">Japanese Sake Cups</h1>
                    </header><!-- .entry-header -->

        
    <div class="entry-content">




<div class="prod">
<a href="https://www.amazon.com/Kotobuki-120-932-Four-Seasons-Sake/dp/B004AE2078?keywords=sake+sets&#038;qid=1555698446&#038;refinements=p_72%3A2661618011&#038;rnid=2661617011&#038;s=gateway&#038;sr=8-3&#038;linkCode=li3&#038;tag=jpn0a-20&#038;linkId=316063b086ed5a0c9c9e3c8578e18ea3&#038;language=en_US&#038;ref_=as_li_ss_il" target="_blank" rel="noopener"><img border="0" src="//ws-na.amazon-adsystem.com/widgets/q?_encoding=UTF8&#038;ASIN=B004AE2078&#038;Format=_SL250_&#038;ID=AsinImage&#038;MarketPlace=US&#038;ServiceVersion=20070822&#038;WS=1&#038;tag=jpn0a-20&#038;language=en_US" ></a><img src="https://ir-na.amazon-adsystem.com/e/ir?t=jpn0a-20&#038;language=en_US&#038;l=li3&#038;o=1&#038;a=B004AE2078" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
</div>


################################################
############ BLANK SPACE APPEARS HERE #############
################################################


<h3 class="prod">Four seasons ceramic sake set</h3>
<p>The four seasons ceramic set is made in Japan and consists of one tokkuri and four o-chokos.</p>
<p>The beautifully glazed tokkuri is imprinted with the kanji characters for the four seasons – summer, autumn, winter, and spring. Also, each of the four drinking cups is a different color to represent the seasons.</p>
<p>The red cup represents autumn leaves, white for the snow in winter, blue for the summer ocean, and green for the grass in spring.</p>
<p><strong>Ideal for:</strong> Cold and hot sake.</p>
<p>Product dimensions are 10.6 x 7.5 x 4.3 inches with a weight of 1.35 pounds.</p>
<p><button type="button" class="btn btn-outline-danger">Buy on Amazon</button></p>
<p class="spacer">Get the latest price from <a href="https://amzn.to/2LhxyL4" target="_blank" rel="nofollow noopener noreferrer">amazon.com</a>.</p>

<hr>
<div id="dpsp-content-bottom" class="dpsp-content-wrapper dpsp-shape-rectangular dpsp-size-medium dpsp-show-on-mobile dpsp-button-style-1"><ul class="dpsp-networks-btns-wrapper dpsp-networks-btns-share dpsp-networks-btns-content dpsp-column-5 dpsp-has-button-icon-animation">
            <li>
                <a rel="nofollow noopener" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Flocalhost%2Fmjp%2F2021%2F06%2F11%2Fhello-world%2F&t=Japanese%20Woodblock%20Prints%3A%20The%20Ultimate%20Guide" class="dpsp-network-btn dpsp-facebook dpsp-first dpsp-has-label" target="_blank" aria-label="Share on Facebook" title="Share on Facebook">
                    <span class="dpsp-network-icon">
                        <span class="dpsp-network-icon-inner"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="18" height="32" viewBox="0 0 18 32"><path d="M17.12 0.224v4.704h-2.784q-1.536 0-2.080 0.64t-0.544 1.92v3.392h5.248l-0.704 5.28h-4.544v13.568h-5.472v-13.568h-4.544v-5.28h4.544v-3.904q0-3.328 1.856-5.152t4.96-1.824q2.624 0 4.064 0.224z"></path></svg></span>
                    </span>
                    <span class="dpsp-network-label">Facebook</span>
                    
                </a>
                
            </li>
            
            <li>
                <a rel="nofollow noopener" href="https://twitter.com/intent/tweet?text=Japanese%20Woodblock%20Prints%3A%20The%20Ultimate%20Guide&url=https%3A%2F%2Flocalhost%2Fmjp%2F2021%2F06%2F11%2Fhello-world%2F" class="dpsp-network-btn dpsp-twitter dpsp-has-label" target="_blank" aria-label="Share on Twitter" title="Share on Twitter">
                    <span class="dpsp-network-icon">
                        <span class="dpsp-network-icon-inner"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="30" height="32" viewBox="0 0 30 32"><path d="M28.928 7.296q-1.184 1.728-2.88 2.976 0 0.256 0 0.736 0 2.336-0.672 4.64t-2.048 4.448-3.296 3.744-4.608 2.624-5.792 0.96q-4.832 0-8.832-2.592 0.608 0.064 1.376 0.064 4.032 0 7.168-2.464-1.888-0.032-3.36-1.152t-2.048-2.848q0.608 0.096 1.088 0.096 0.768 0 1.536-0.192-2.016-0.416-3.328-1.984t-1.312-3.68v-0.064q1.216 0.672 2.624 0.736-1.184-0.8-1.888-2.048t-0.704-2.752q0-1.568 0.8-2.912 2.176 2.656 5.248 4.256t6.656 1.76q-0.16-0.672-0.16-1.312 0-2.4 1.696-4.064t4.064-1.696q2.528 0 4.224 1.824 1.952-0.384 3.68-1.408-0.672 2.048-2.56 3.2 1.664-0.192 3.328-0.896z"></path></svg></span>
                    </span>
                    <span class="dpsp-network-label">Twitter</span>
                    
                </a>
                
            </li>
            
            <li>
                <button rel="nofollow noopener" data-href="#" class="dpsp-network-btn dpsp-pinterest dpsp-last dpsp-has-label" target="_blank" aria-label="Save to Pinterest" title="Save to Pinterest">
                    <span class="dpsp-network-icon">
                        <span class="dpsp-network-icon-inner"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="23" height="32" viewBox="0 0 23 32"><path d="M0 10.656q0-1.92 0.672-3.616t1.856-2.976 2.72-2.208 3.296-1.408 3.616-0.448q2.816 0 5.248 1.184t3.936 3.456 1.504 5.12q0 1.728-0.32 3.36t-1.088 3.168-1.792 2.656-2.56 1.856-3.392 0.672q-1.216 0-2.4-0.576t-1.728-1.568q-0.16 0.704-0.48 2.016t-0.448 1.696-0.352 1.28-0.48 1.248-0.544 1.12-0.832 1.408-1.12 1.536l-0.224 0.096-0.16-0.192q-0.288-2.816-0.288-3.36 0-1.632 0.384-3.68t1.184-5.152 0.928-3.616q-0.576-1.152-0.576-3.008 0-1.504 0.928-2.784t2.368-1.312q1.088 0 1.696 0.736t0.608 1.824q0 1.184-0.768 3.392t-0.8 3.36q0 1.12 0.8 1.856t1.952 0.736q0.992 0 1.824-0.448t1.408-1.216 0.992-1.696 0.672-1.952 0.352-1.984 0.128-1.792q0-3.072-1.952-4.8t-5.12-1.728q-3.552 0-5.952 2.304t-2.4 5.856q0 0.8 0.224 1.536t0.48 1.152 0.48 0.832 0.224 0.544q0 0.48-0.256 1.28t-0.672 0.8q-0.032 0-0.288-0.032-0.928-0.288-1.632-0.992t-1.088-1.696-0.576-1.92-0.192-1.92z"></path></svg></span>
                    </span>
                    <span class="dpsp-network-label">Pinterest</span>
                    
                </button>
                
            </li>
            </ul></div>    </div><!-- .entry-content -->

    <footer class="entry-footer">
         | <span class="edit-link"><a class="post-edit-link" href="https://localhost/mjp/wp-admin/post.php?post=1&#038;action=edit">Edit <span class="screen-reader-text">"Japanese Woodblock Prints: The Ultimate Guide"</span></a></span>    </footer><!-- .entry-footer -->
</article><!-- #post-## -->

        </div><!-- #main -->
    </section><!-- #primary -->


<aside id="secondary" class="widget-area col-sm-3" role="complementary">
    <section id="search-3" class="widget widget_search"><h3 class="widget-title">Search</h3><form role="search" method="get" class="search-form" action="https://localhost/mjp/">
    <label>
        <input type="search" class="search-field form-control" placeholder="Search &hellip;" value="" name="s" title="Search for:">
    </label>
    <input type="submit" class="search-submit btn btn-default" value="Search">
</form>

</section><section id="text-2" class="widget widget_text"><h3 class="widget-title">Categories</h3>            <div class="textwidget"><div class="sbar">
<ul class="nav flex-column">
<li class="nav-item"><a href="https://morejapanplease.com/japanese-culture">Culture</a></li>
<li class="nav-item"><a href="https://morejapanplease.com/japanese-food">Food</a></li>
<li class="nav-item"><a href="https://morejapanplease.com/travel-japan">Travel</a></li>
<li class="nav-item"><a href="https://morejapanplease.com/japanese-culture">Where to stay</a></li>
<li class="nav-item"><a href="https://morejapanplease.com/japanese-products">Products</a></li>
</ul>
</div>
</div>
        </section>
        <section id="recent-posts-2" class="widget widget_recent_entries">
        <h3 class="widget-title">Recent Posts</h3>
        <ul>
                                            <li>
                    <a href="https://localhost/mjp/2021/06/11/hello-world/" aria-current="page">Japanese Woodblock Prints: The Ultimate Guide</a>
                                    </li>
                    </ul>

        </section><section id="meta-2" class="widget widget_meta"><h3 class="widget-title">Meta</h3>
        <ul>
            <li><a href="https://localhost/mjp/wp-admin/">Site Admin</a></li>            <li><a href="https://localhost/mjp/wp-login.php?action=logout&#038;_wpnonce=1ac2fcb802">Log out</a></li>
            <li><a href="https://localhost/mjp/feed/">Entries feed</a></li>
            <li><a href="https://localhost/mjp/comments/feed/">Comments feed</a></li>

            <li><a href="https://wordpress.org/">WordPress.org</a></li>
        </ul>

        </section></aside><!-- #secondary -->
            </div><!-- .row -->
        </div><!-- .container -->
    </div><!-- #content -->
        <footer id="colophon" class="site-footer navbar-light" role="contentinfo">
        <div class="container pt-3 pb-3">
            <div class="site-info">
                &copy; 2021 <a href="https://localhost/mjp">MoreJapanPlease</a>                <span class="sep"> | </span>
                <a class="credits" href="https://afterimagedesigns.com/wp-bootstrap-starter/" target="_blank" title="WordPress Technical Support" alt="Bootstrap WordPress Theme">Bootstrap WordPress Theme</a>

            </div><!-- close .site-info -->
        </div>
    </footer><!-- #colophon -->
</div><!-- #page -->

<div id="mv-grow-data" data-settings='{&quot;general&quot;:{&quot;contentSelector&quot;:false},&quot;shareCounts&quot;:{&quot;pinterest&quot;:0},&quot;shouldRun&quot;:true,&quot;buttonSVG&quot;:{&quot;facebook&quot;:{&quot;path&quot;:&quot;M17.12 0.224v4.704h-2.784q-1.536 0-2.080 0.64t-0.544 1.92v3.392h5.248l-0.704 5.28h-4.544v13.568h-5.472v-13.568h-4.544v-5.28h4.544v-3.904q0-3.328 1.856-5.152t4.96-1.824q2.624 0 4.064 0.224z&quot;,&quot;width&quot;:18,&quot;height&quot;:32},&quot;twitter&quot;:{&quot;path&quot;:&quot;M28.928 7.296q-1.184 1.728-2.88 2.976 0 0.256 0 0.736 0 2.336-0.672 4.64t-2.048 4.448-3.296 3.744-4.608 2.624-5.792 0.96q-4.832 0-8.832-2.592 0.608 0.064 1.376 0.064 4.032 0 7.168-2.464-1.888-0.032-3.36-1.152t-2.048-2.848q0.608 0.096 1.088 0.096 0.768 0 1.536-0.192-2.016-0.416-3.328-1.984t-1.312-3.68v-0.064q1.216 0.672 2.624 0.736-1.184-0.8-1.888-2.048t-0.704-2.752q0-1.568 0.8-2.912 2.176 2.656 5.248 4.256t6.656 1.76q-0.16-0.672-0.16-1.312 0-2.4 1.696-4.064t4.064-1.696q2.528 0 4.224 1.824 1.952-0.384 3.68-1.408-0.672 2.048-2.56 3.2 1.664-0.192 3.328-0.896z&quot;,&quot;width&quot;:30,&quot;height&quot;:32},&quot;pinterest&quot;:{&quot;path&quot;:&quot;M0 10.656q0-1.92 0.672-3.616t1.856-2.976 2.72-2.208 3.296-1.408 3.616-0.448q2.816 0 5.248 1.184t3.936 3.456 1.504 5.12q0 1.728-0.32 3.36t-1.088 3.168-1.792 2.656-2.56 1.856-3.392 0.672q-1.216 0-2.4-0.576t-1.728-1.568q-0.16 0.704-0.48 2.016t-0.448 1.696-0.352 1.28-0.48 1.248-0.544 1.12-0.832 1.408-1.12 1.536l-0.224 0.096-0.16-0.192q-0.288-2.816-0.288-3.36 0-1.632 0.384-3.68t1.184-5.152 0.928-3.616q-0.576-1.152-0.576-3.008 0-1.504 0.928-2.784t2.368-1.312q1.088 0 1.696 0.736t0.608 1.824q0 1.184-0.768 3.392t-0.8 3.36q0 1.12 0.8 1.856t1.952 0.736q0.992 0 1.824-0.448t1.408-1.216 0.992-1.696 0.672-1.952 0.352-1.984 0.128-1.792q0-3.072-1.952-4.8t-5.12-1.728q-3.552 0-5.952 2.304t-2.4 5.856q0 0.8 0.224 1.536t0.48 1.152 0.48 0.832 0.224 0.544q0 0.48-0.256 1.28t-0.672 0.8q-0.032 0-0.288-0.032-0.928-0.288-1.632-0.992t-1.088-1.696-0.576-1.92-0.192-1.92z&quot;,&quot;width&quot;:23,&quot;height&quot;:32}}}'></div>
<script type='text/javascript' async data-noptimize src='https://localhost/mjp/wp-content/plugins/social-pug/assets/dist/front-end-free.1.18.2.js?ver=1.18.2' id='dpsp-frontend-js-pro-js'></script>
<script type='text/javascript' src='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/inc/assets/js/bootstrap.min.js?ver=5.7.2' id='wp-bootstrap-starter-bootstrapjs-js'></script>
<script type='text/javascript' src='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/inc/assets/js/theme-script.min.js?ver=5.7.2' id='wp-bootstrap-starter-themejs-js'></script>
<script type='text/javascript' src='https://localhost/mjp/wp-content/themes/wp-bootstrap-starter/inc/assets/js/skip-link-focus-fix.min.js?ver=20151215' id='wp-bootstrap-starter-skip-link-focus-fix-js'></script>
<script type='text/javascript' src='https://localhost/mjp/wp-includes/js/comment-reply.min.js?ver=5.7.2' id='comment-reply-js'></script>
<script type='text/javascript' id='q2w3_fixed_widget-js-extra'>
/* <![CDATA[ */
var q2w3_sidebar_options = [{"sidebar":"sidebar-1","margin_top":10,"margin_bottom":0,"stop_id":"","screen_max_width":0,"screen_max_height":0,"width_inherit":false,"refresh_interval":1500,"window_load_hook":false,"disable_mo_api":false,"widgets":["meta-2"]}];
/* ]]> */
</script>
<script type='text/javascript' src='https://localhost/mjp/wp-content/plugins/q2w3-fixed-widget/js/q2w3-fixed-widget.min.js?ver=5.3.0' id='q2w3_fixed_widget-js'></script>
<script type='text/javascript' src='https://localhost/mjp/wp-includes/js/wp-embed.min.js?ver=5.7.2' id='wp-embed-js'></script>
</body>
</html>
 
Upvote 0 Downvote
BGB said:
It is related with your css file. Which you haven't provided. It is not possible find the problem without css file.
Click to expand...
Code: 
/*
Theme Name: WP Bootstrap Starter
Theme URI: https://afterimagedesigns.com/wp-bootstrap-starter/
Author: Afterimage Designs
Author URI: https://afterimagedesigns.com/
Description:  The best WordPress starter theme based on the most powerful frameworks in the world: "_s" (by Automattic, the main people behind WordPress development), Twitter Bootstrap (the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web) and Font Awesome (or Fontawesome, a full suite of 675+ pictographic icons for easy scalable vector graphics on websites). This theme, like WordPress, is licensed under the GPL. You can use this theme as base for your next WordPress theme project and you are allowed to remove the link at the footer or do whatever you want. Your feedback on how we can continuously improve this WordPress Starter Theme Bootstrap will be highly appreciated. Page templates includes Right-sidebar (default page template), Left-Sidebar, Full-Width, Blank with container, Blank without container Page. Other features - Currently using Bootstrap v4.0.0 , Widgetized footer area, WooCommerce ready, Compatible with Contact Form 7, Compatible with Visual Composer, Compatible with Elementor Page Builder. This theme will be an active project which we will update from time to time. Check this page regularly for the updates.
Version: 3.3.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: wp-bootstrap-starter
Requires at least: 4.7
Requires PHP: 5.2.4
Tested up to: 5.4
Tags: blog, custom-menu, featured-images, threaded-comments, translation-ready, right-sidebar, custom-background, e-commerce, theme-options, sticky-post, full-width-template
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
    ## Links
    ## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
    ## Posts and pages
    ## Comments
# Infinite scroll
# Media
    ## Captions
    ## Galleries
# Woocommerce
# Footer
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,600;1,300&display=swap');

body {
  margin: 0;
  -webkit-font-smoothing: auto;
  font-family:rubik, sans-serif;
  color:#000;
}

#the_title { width:100%; text-align:center; }
.container.gray { width:100%; height:auto; background-color:#eee; float:left; margin:0 0 55px 0; padding-bottom:10px; }
.container.gray ul li { margin:0 25px 3px 0; font-size:15px;}
#dpsp-content-top { margin-bottom:0;}
p.description {font-style:italic; font-size:14px; line-height:23px; margin:15px 0 30px 0; color:#444; }
p.strong { font-size: 17px; font-weight:bold; margin:14px 0 14px 0; text-align:center;}
#masthead {background-color:#fff!important;}
p.breadcrumbs{margin:0 0 25px 0;font-size:14px;color:#777;}
.row.one { margin-bottom:20px; }
.negative-space {
margin-bottom:-12px;
}
table {
  width: 100%!important;
}
.prod { width:30%; height:30%; float:left; margin-right:30px;}

.panel { margin-bottom:55px;}

li.strong { font-weight:600;}

.nav.flex-column { background-color:#eee; }



article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

a {
  background-color: transparent;
}

a:active,
a:hover {
  outline: 0;
}

dfn {
  font-style: italic;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 2.5rem;
}

hr {
  box-sizing: content-box;
  margin:50px 0 50px 0;
  border:2px solid #F5F5F5;
  clear:both;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
  clear: both;
  color: #111;
  font-weight: 600;

  margin-bottom: 15px;
  font-family:rubik, Open Sans;

}

h1, h1.entry-title {
  font-size: 3.7rem;
  padding:0 0 0 0;
  letter-spacing:-2px;
}
h2 {
  font-size: 2.3rem;
  padding-bottom: 0.2em;
  line-height: 1.25;
  font-weight:700;
}
h3 {
  font-size: 1.7rem;
  line-height: 25px;
  padding: 0.4em 0 0.3em 0;
}
h3.prod {
font-size:0.8em;padding:0; }
.prod img { display:inline;}
h4 {
  font-size: 1.4rem;
  line-height: 20px;
  padding: 0.4em 0 0.3em 0;
}
h5 {
  font-size: 14px;
  line-height: 17.5px;
}

p {
  margin-bottom: 1.5em;
  font-size:18px;
  line-height:32px;
}

h2.entry-title {
  border-bottom: 1px solid #eaecef;
}
h3.widget-title {
  font-size: 1.2rem;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
body {
  background: #fff;
  /* Fallback for when there is no custom background color defined. */
}

img {
  height: auto;
  /* Make sure images are scaled correctly. */
  width: 100%;
  /* Adhere to container width. */
}

figure {
  margin: 1em 0;
  /* Extra wide images within figure tags don't overflow the content area. */
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
header#masthead {
  margin-bottom: 0;
  background-color: #563d7c ;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.05), inset 0 -1px 0 rgba(0,0,0,.1);
  padding: .74rem 1rem;
}

.navbar-brand > a {
  color:#000;
  font-size: 1.1rem;
  outline: medium none;
  text-decoration: none;
  color: #000;
  font-weight: 700;
}

.navbar-brand > a:visited, .navbar-brand > a:hover {
  text-decoration: none;
}

#page-sub-header {
  position: relative;
  padding-top: 5rem;
  padding-bottom: 0;
  text-align: center;
  font-size: 1.25rem;
  background-size: cover !important;
}

body:not(.theme-preset-active) #page-sub-header h1 {
  line-height: 1.6;
  font-size: 4rem;
  color: #563e7c;
  margin: 0 0 1rem;
  border: 0;
  padding: 0;
}

#page-sub-header p {
  margin-bottom: 0;
  line-height: 1.4;
  font-size: 1.25rem;
  font-weight: 300;
}
body:not(.theme-preset-active) #page-sub-header p {
color: #212529;
}
a.page-scroller {
  color: #333;
  font-size: 2.6rem;
  display: inline-block;
  margin-top: 2rem;
}

@media screen and (min-width: 768px) {
  body:not(.theme-preset-active) #page-sub-header h1 {
    font-size: 3.750rem;
  }
  body:not(.theme-preset-active) #page-sub-header {
    font-size: 1.25rem;
  }
}
@media screen and (min-width: 992px) {
  #page-sub-header p {
    max-width: 43rem;
    margin: 0 auto;
  }
}
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
#masthead nav {
  padding-left: 0;
  padding-right: 0;
}

body:not(.theme-preset-active) #masthead .navbar-nav > li > a {
  color: #000;
  padding: 0.5rem;
  font-weight: 500;
  font-size: 0.875rem;
}

body:not(.theme-preset-active) #masthead .navbar-nav > li > a:hover,
body:not(.theme-preset-active) #masthead .navbar-nav > li.current_page_item > a {
  color: #fff;
  font-weight: 600;
  /*background: #f9f9f9;*/
}

.navbar-brand {
  height: auto;
}

.navbar-toggle .icon-bar {
  background: #000 none repeat scroll 0 0;
}

.dropdown-menu .dropdown-toggle::after {
  border-bottom: 0.3em solid transparent;
  border-left: 0.3em solid;
  border-top: 0.3em solid transparent;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children {
    position: relative;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}
.dropdown.menu-item-has-children .dropdown.menu-item-has-children:hover>.dropdown-menu {
    display: block;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children:hover>a:after {
    border-left-color: #fff;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children.pull-left {
    float: none;
}

.dropdown.menu-item-has-children .dropdown.menu-item-has-children.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

.dropdown-item {
  line-height: 1.2;
  padding-bottom: 0.313rem;
  padding-top: 0.313rem;
}

.dropdown-menu {
  min-width: 12.500rem;
}

.dropdown .open .dropdown-menu {
  display: block;
  left: 12.250em;
  top: 0;
}

.dropdown-menu .dropdown-item {
  white-space: normal;
  background: transparent;
  line-height: 1.6;
}
.dropdown-menu .dropdown-item:hover {
  background: transparent;
}

@media screen and (min-width: 37.5em) {
  .menu-toggle {
    display: none;
  }
}
@media screen and (min-width: 769px) {
  .dropdown-menu li > .dropdown-menu {
    right: -9.875rem;
    top: 1.375rem;
  }
}
@media screen and (max-width: 991px) {
  .navbar-nav .dropdown-menu {
    border: medium none;
    margin-left: 1.250rem;
    padding: 0;
  }

  .dropdown-menu li a {
    padding: 0;
  }

  #masthead .navbar-nav > li > a {
    padding-bottom: 0.625rem;
    padding-top: 0.313rem;
  }

  .navbar-light .navbar-toggler {
    border: medium none;
    outline: none;
  }
}
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
  overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  float: left;
  width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  float: right;
  text-align: right;
  width: 50%;
}
.comment-content.card-block {
  padding: 20px;
}

.navigation.post-navigation {
  padding-top: 1.875rem;
}

.post-navigation .nav-previous a,
.post-navigation .nav-next a {
  border: 1px solid #ddd;
  border-radius: 0.938rem;
  display: inline-block;
  padding: 0.313rem 0.875rem;
  text-decoration: none;
}

.post-navigation .nav-next a::after {
  content: " \2192";
}

.post-navigation .nav-previous a::before {
  content: "\2190 ";
}

.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover {
  background: #eee none repeat scroll 0 0;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 0.313rem;
  line-height: normal;
  padding: 0.938rem 1.438rem 0.875rem;
  text-decoration: none;
  top: 0.313rem;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
  outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

a img.alignright {
  float: right;
  margin: 0.313rem 0 1.25rem 1.25rem;
}

a img.alignnone {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

a img.alignleft {
  float: left;
  margin: 0.313rem 1.25rem 1.25rem 0;
}

a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption.alignnone {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

.wp-caption.alignleft {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

.wp-caption.alignright {
  margin: 0.313rem 0 1.25rem 1.25rem;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: "";
  display: table;
  table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
  margin: 0 0 1.5em;
  font-size: 0.875rem;
  /* Make sure select elements fit in widgets. */
}
.widget select {
  max-width: 100%;
}

.widget_search .search-form input[type="submit"] {
  display: none;
}

.nav > li > a:focus,
.nav > li > a:hover {
  background-color: #eee;
  text-decoration: none;
}
.half-rule {
  width: 6rem;
  margin: 2.5rem 0;
}
.widget_categories .nav-link {
  display: inline-block;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
#content.site-content {
  padding-bottom: 3.75rem;
  padding-top: 4.125rem;
}

.sticky .entry-title::before {
  content: '\f08d';
  font-family: "Font Awesome\ 5 Free";
  font-size: 1.563rem;
  left: -2.5rem;
  position: absolute;
  top: 0.375rem;
  font-weight: 900;
}

.sticky .entry-title {
  position: relative;
}

.single .byline,
.group-blog .byline {
  display: inline;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 0 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

.page-template-blank-page .entry-content,
.blank-page-with-container .entry-content {
  margin-top: 0;
}

.post.hentry {
  margin-bottom: 4rem;
}

.posted-on, .byline, .comments-link {
  color: #9a9a9a;
}

.entry-title > a {
  color: inherit;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  /* Theme Footer (when set to scrolling) */
  display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
  background: #f1f1f1 none repeat scroll 0 0;
  border: 1px solid #f0f0f0;
  max-width: 96%;
  padding: 0.313rem 0.313rem 0;
  text-align: center;
}
.wp-caption img[class*="wp-image-"] {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 100%;
  padding: 0;
  width: auto;
}
.wp-caption .wp-caption-text {
  font-size: 0.688rem;
  line-height: 1.063rem;
  margin: 0;
  padding: 0.625rem;
}

.wp-caption-text {
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
  margin-bottom: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}
.gallery-item .gallery-columns-2 {
  max-width: 50%;
}
.gallery-item .gallery-columns-3 {
  max-width: 33.33333%;
}
.gallery-item .gallery-columns-4 {
  max-width: 25%;
}
.gallery-item .gallery-columns-5 {
  max-width: 20%;
}
.gallery-item .gallery-columns-6 {
  max-width: 16.66667%;
}
.gallery-item .gallery-columns-7 {
  max-width: 14.28571%;
}
.gallery-item .gallery-columns-8 {
  max-width: 12.5%;
}
.gallery-item .gallery-columns-9 {
  max-width: 11.11111%;
}

.gallery-caption {
  display: block;
}

/*--------------------------------------------------------------
# Plugin Compatibility
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Woocommerce
--------------------------------------------------------------*/
.woocommerce-cart-form .shop_table .coupon .input-text {
  width: 8.313rem !important;
}

.variations_form .variations .value > select {
  margin-bottom: 0.625rem;
}

.woocommerce-MyAccount-content .col-1,
.woocommerce-MyAccount-content .col-2 {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Elementor
--------------------------------------------------------------*/
.elementor-page article .entry-footer {
  display: none;
}

.elementor-page.page-template-fullwidth #content.site-content {
  padding-bottom: 0;
  padding-top: 0;
}

.elementor-page .entry-content {
  margin-top: 0;
}

/*--------------------------------------------------------------
## Visual Composer
--------------------------------------------------------------*/
.vc_desktop article .entry-footer {
  display: none;
}

.vc_desktop #content.site-content {
  padding-bottom: 0;
  padding-top: 0;
}

.vc_desktop .entry-content {
  margin-top: 0;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
footer#colophon {
  font-size: 85%;
}
body:not(.theme-preset-active) footer#colophon {
  color: #99979c;
  background-color: #f7f7f7;
}
.navbar-dark .site-info {
  color: #fff;
}
.copyright {
  font-size: 0.875rem;
  margin-bottom: 0;
  text-align: center;
}

.copyright a, footer#colophon a {
  color: inherit;
}

@media screen and (max-width: 767px) {
  #masthead .navbar-nav > li > a {
    padding-bottom: 0.938rem;
    padding-top: 0.938rem;
  }
}
/*--------------------------------------------------------------
# Media Query
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Notebook
--------------------------------------------------------------*/
@media only screen and (max-width: 1280px) {
  html {
    font-size: 95%;
  }
}

@media screen and (max-width: 1199px) {
  .navbar-dark .dropdown-item {
    color: #fff;
  }
  .navbar-nav .dropdown-menu {
    background: transparent;
    box-shadow: none;
    border: none;
  }
}
/*--------------------------------------------------------------
## Netbook
--------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {
  html {
    font-size: 90%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 960px) {
  html {
    font-size: 85%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
  html {
    font-size: 80%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
  html {
    font-size: 75%;
  }
}
 
Upvote 0 Downvote
There are two images in this div -
HTML: 
<div class="prod">
<a href="https://www.amazon.com/Kotobuki-120-932-Four-Seasons-Sake/dp/B004AE2078?keywords=sake+sets&qid=1555698446&refinements=p_72%3A2661618011&rnid=2661617011&s=gateway&sr=8-3&linkCode=li3&tag=jpn0a-20&linkId=316063b086ed5a0c9c9e3c8578e18ea3&language=en_US&ref_=as_li_ss_il" target="_blank" rel="noopener"><img border="0" src="//ws-na.amazon-adsystem.com/widgets/q?_encoding=UTF8&ASIN=B004AE2078&Format=_SL250_&ID=AsinImage&MarketPlace=US&ServiceVersion=20070822&WS=1&tag=jpn0a-20&language=en_US" ></a><img src="https://ir-na.amazon-adsystem.com/e/ir?t=jpn0a-20&language=en_US&l=li3&o=1&a=B004AE2078" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
</div>
You need to hide the second image using display:none like below -
HTML: 
<div class="prod">
<a href="https://www.amazon.com/Kotobuki-120-932-Four-Seasons-Sake/dp/B004AE2078?keywords=sake+sets&#038;qid=1555698446&#038;refinements=p_72%3A2661618011&#038;rnid=2661617011&#038;s=gateway&#038;sr=8-3&#038;linkCode=li3&#038;tag=jpn0a-20&#038;linkId=316063b086ed5a0c9c9e3c8578e18ea3&#038;language=en_US&#038;ref_=as_li_ss_il" target="_blank" rel="noopener"><img border="0" src="//ws-na.amazon-adsystem.com/widgets/q?_encoding=UTF8&#038;ASIN=B004AE2078&#038;Format=_SL250_&#038;ID=AsinImage&#038;MarketPlace=US&#038;ServiceVersion=20070822&#038;WS=1&#038;tag=jpn0a-20&#038;language=en_US" ></a><img style="display: none" src="https://ir-na.amazon-adsystem.com/e/ir?t=jpn0a-20&#038;language=en_US&#038;l=li3&#038;o=1&#038;a=B004AE2078" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
</div>
 
Upvote 0 Downvote
Your solution works.

My only concern is that is the exact piece of code I got from Amazon.com.

I have other websites that uses the same double image code from Amazon, yet they only display the image once.
 
Upvote 0 Downvote

New Threads

Latest posts

Share this page

Buy us a coffee!

Code Academy Advertisement
DataCamp Advertisement

About Us

Code Forum is a community platform where coding enthusiasts can connect with other developers, engage in discussions, ask for help, and share their knowledge with a supportive community. It's a perfect place to improve your coding skills and to find a community of like-minded individuals who share your passion for coding.

Site links

Stay Connected

Back
Top Bottom