http://www.thirdavenuespa.com/
Can someone please point me in the right direction for figuring out why this page seemingly shows 2 versions of the same content? When viewed on a mobile device you will see the content repeated, once in proper mobile formatting and then again as the desktop version.
This is from the main header image down to the "Aveda" logo.
If I add some test text to that section, it only shows in the mobile formatted version, and the desktop version just stays the same. There is only one copy of this content in the page!
<!--banner-->
<div class="banner">
<img src="images/banner.jpg" width="1200" height="698" alt="">
<div class="banwrap">
<div class="container">
<div class="baninfo">
<h1>Refined <span style="font-family: 'Montserrat', sans-serif; font-weight: regular;">&</span> Distinct</h1>
<div align="center"><p style="font-size: 20px;">stimulate . nurture . educate</p></div>
</div>
</div>
</div>
</div>
<!--banner ends-->
This is just one of you're instagram photo's pulling through from you're instagram feed. It looks a little strange, just because it's a photo of the desktop version of your site.
In your image gallery there is an image of the website. A screen shot. That's what is making it appear as the site is repeated. You have the site. Then a photo of the site.
Related
I have a website that has multiple retailer images showing, and these are affiliate links. The issue I have is when I view on a desktop, even with cleared cache, cookies, and other browsers, I can see all retailer images, however when I am speaking with users of my site, they can not see images on desktop only mobile.
The website is www.yourshoppingcentre.co.uk
I have a used the same code through the site to make it easier to add more retailers in the future, and an example can be found here:
<div class="card" style="border: None; padding-top: 5px;">
<div class="thumbnail center well well-small text-center">
<!-- START ADVERTISER: Kelsey Media from awin.com -->
<a rel="sponsored" href="https://www.awin1.com/cread.php?s=3105047&v=19854&q=433993&r=1052665" target="blank">
<img src="images/advertisers/kelsey_media.jpg" >
</a>
<!-- END ADVERTISER: Kelsey Media from awin.com -->
<div class="card-body">
<div class="span12">
<div class="thumbnail center well well-small text-center">
<!-- <button class="btn btn-primary mb-2">Add to Favourites!</button> -->
</div>
</div>
</div>
</div>
</div>
One user has shown me a console screenshot where it shows the images have CSS of Display: None !important;
However again when inspecting the site myself I do not see this CSS and have no concept of how they are seeing this.
So I am guess I am asking a couple of things here, is this issue replicable, and secondly, if so, how to solve, as it is affects a subset and not all users is my understanding.
Appreciate any help!
Thanks!
It's blocked by your adblock probably.
You can see that in your inspect tool :
The images are being blocked by an ad blocker on desktop. If your users disable their ad blocker, the images will show on desktop.
To resolve this, you might consider changing the URL you're using for those images.
Specifically, it seems that uBlock Origin doesn't like advertisers being in the image url.
A very simple landing page to test the latest release of bootstrap appears to work correctly on my development machine, responding as expected when the browser window width is changed.
However, on my iPhoneSE (IOS 13.7) the top and bottom of the page is truncated like this:-
The full page can be seen on a laptop here: https://new-inn-pembridge.co.uk and this is the code:-
<div class="container bg-ltgreen">
<div class="d-flex justify-content-center align-items-center" style="height: 100vh;">
<div class="text-center">
<h1>The New Inn, Pembridge</h1>
<img class="img-fluid" src="img/newinn.jpg" />
<h5 class="pt-3" style="color: rgb(114, 7, 7);">A brand new website is under construction here.</h5>
<p class="pb-5" style="color: rgb(114, 7, 7);">Have another look about the end of September!</p>
</div>
</div>
</div>
Have you checked it with every browser?
I just checked it in my POCO F1, chrome browser (Android) and this page is getting displayed as expected. Kindly, check if you are using Safari, chrome or any other so that it gets clear that which browser is giving problem.
When I uploaded the html & css parts into webhost, on my browser (Google Chrome) didn't show all of the page, so I deleted cache, media, everything.
Tried to enter again on the website, still wasn't loaded all of the page.
I enter to website by Mozilla, page was there, full loaded.
Asked my friend to enter by chrome to my website, page was full loaded
I tried to enter again by chrome to website, page wasn't full loaded.
Restarted my pc, tried again, page wasn't full loaded.
But why?
That's how only I see from Chrome
That's how everybody sees even if it's from Chrome or another browser
Missing code :
<div class="banner">
<div class="container">
<div class="banner-main">
<div class="col-md-6 banner-left">
<img src="images/ba.png" alt="" class="img-responsive">
</div>
<div class="col-md-4 blc-layer3-grids-3 simpleCart_shelfItem">
<span class="bann-heart"></span>
<h2>OFERTA SPECIALA ! </h2>
<hr> <br>
<h1>Reducere MAJORĂ LA <font style="color:red">UNIVERSAL GAIN FAST !</font></h1>
<hr>
<h2 class="item_price"><strike>$200.00</strike></h5>
<h2 class="item_price"><strong>$100.00</strong></h5>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
I had some similar issue but then i realised that was due to cache.
How i found was, i re-uoloaded the file to another directory and everything worked fine. Sometimes chrome is a bad guy with cache issue.
Probably try deleting cache again or reload the page with shift pressed several times.
With NPAPI being faced out by Chrome, We've been trying to find a good alternative to an Applet we had for printing checks and invoices. There are many options, like NaCl and PNaCl from chrome (with PPAPI) however those really mean settling for chrome, which isn't a really good idea. Jumping from solution to solution we've found that it is possible to print absolute positions from HTML, like so:
<html style="font-family: courier new; font-size: 11pt;">
<body>
<div style="position:absolute; left:129mm; top:25mm"><<**.***,**>></div> <!-- PLC_POSICIONMTO -->
<div style="position:absolute; left:30mm; top:38mm;"><<<??????>>></div> <!-- PLC_POSICIONBENEFICIARIO -->
<div style="position:absolute; left:40mm; top:44mm;"><<<<**.***,**>>>></div> <!-- PLC_POSICIONMTO1 -->
<div style="position:absolute; left:20mm; top:56mm;">?????</div> <!-- PLC_POCISIONFECHA -->
<div style="position:absolute; left:82mm; top:56mm;">???</div> <!-- PLC_POCISIONANO -->
<div style="position:absolute; left:mm; top:mm;"></div>
<div style="position:absolute; left:mm; top:mm;"></div>
</body>
This is an example i made to test if the position works, those attributes will come from a DataBase. It all seems to work, however when trying to print from chrome to a dot matrix printer, the preview looks weirdly zoomed in, and doesn't print correctly, but when I print to a PDF and then to the Dot Matrix (or from firefox) it works like it shoul (somewhat). The page design in the Chrome Preview looks weird too, when the page is in portrait mode, it lookes squared, but in landscape mode it lookes as it should in vertical (and it seems to work fine until i print, where it prints as in landscape mode and not like the preview shows).
Does anybody have any idea why this is happening?. Or is there another solution that doesn't force me to use chrome alone as he company's browser?.
I built a website, http://charlottemobiletrainers.com and the main logo on the index page shows up for me using Chrome but not in Safari and doesn't show up for my friend on their laptop in any browser. The photo was a ".gif" and I changed the file to ".png" just to see if that changed anything but it didn't help. And then I tried renaming the file because I used "_" in it originally but that didn't help. I don't know what else to try.
The image is currently in my style.css file. Could that be the problem?
You've laid it out quite oddly to start with. I would do it like this:
<div id="featured">
<div class="left">
<h3>Mobile Personal Trainers</h3>
<p>Are you ready for summertime in Charlotte? Let Mobile Trainers help you look and feel your best with a personalized workout program <i>JUST FOR YOU!</i> Our personal trainers will go wherever you want whenever you want. Let's get started!</p>
<input type="button" value="Get Started!" onclick="parent.location='contact.html'">
</div>
<div class="right">
<img src="logo.png" width="blah" height="blah" alt=""/>
</div>
Then set the #feature to the width and height you want it to be then set the class .right to whatever width the logo is and the remaining width set to the .left class.