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 Chrome Issue

anuraa

Legendary Coder
Hi Friends

I am in the process of developing a website. www.sis.anura7.ca

When a particular user enters the above url, it gives image1 as expected. But when a particular user presses Menu,
it gives the image2. It doesn't happen to me nor to my friend. It navigate nice

Thanks for your helps.
 

Attachments

  • image1.png
    image1.png
    204.5 KB · Views: 5
  • image2.png
    image2.png
    72.6 KB · Views: 5
Cant fix images - need code
Thanks a lot. It doesn't happen to me. Works fine. I asked one of my friend too, to check. It works nice to him as well. Particular user, uses Samsung phone, only to her, so far. You may too check with entering www.sis.anura7.ca to see whether you encounters the same.. In my computer too, it works fine. Two images that uploaded doesn't show the exact image for some reason.

Issue is when that particular user tap the MENU on top right corner, it doesn't bring the overlay with menu items. But the Image2 overlaying the main page with Privacy info, next line Secure connection with url, then, 2 tracking attempts blocked etc.

HTML:
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="google" value="notranslate">
  <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://kit.fontawesome.com/b99e675b6e.js1"></script> 
    <link rel="stylesheet" href="overlay.css">
    <link rel="stylesheet" href="dpdnmenu.css">
    <link rel="stylesheet" href="collapsible.css">
<script src="imagerotate.js"></script>
<script src="animateview.js"></script>
</head>
<body>
<div id="wrap">
  <div id="Mysidenav">
    <div class="sidenav" id="sidenav">
       <a href="javascript:void(0)" Class="btnd" onclick="closeNav()">Menu</a>
       <a href="javascript:void(0)"  class="closebtn" onclick="closeNav()"> &times;</a>
       <a class="active" href="index.html"><img src="abouth.png"> About </a>
       <a href="poems.html"><img src="poetry.png">  Her poems</a>
       <a href="music.html"><img src="music.png">   Her Music</a>
       <a href="paintings.html"><img src="painting.png">   Her Paintings</a>
       <a href="phylan.html"><img src="phylantrophy.png"> Philanthrophy</a>
       <a  href="students.html" ><img src="we1.png">  Her Students</a>
       <a href="contacts.html" ><img src="contact1.png">   Contact her</a>
       <a href="https://www.facebook.com/dhakshinidesilva?mibextid=LQQJ4d" target="_blank"><img src="facebook.png">  facebook</a>
      <a href="https://www.instagram.com/hoot.athenerdyowl/" target="_blank"><img src="instagram.png"> Instagram</a>
      <br><br>
      <a href="https://www.google.com"  class="lsub"><img src="logout.png"> Log Out</a>
    </div>
  </div>
  <div  id="menu">
    <div id="header"><img src="nangi.webp" height="30px" width="auto" alt=""/>
        <span class="lsize5">About her</span>
        <span  class="mtext" style="cursor:pointer" onclick="openNav()">Menu</span> 
        <span  class="dtext"  style="cursor:pointer" onclick="openNav()">&#9776;</span>
    </div>
  </div>
  <div id="container">
    <img class="owl1" src="nangi.webp" alt="" width="200" height="auto" alt="A "/>
          <p><br><br><span class="lsize1">Her Name is Mrs. Dxxxxxxx</span><br>
            <span class="lsize1">Fernando De Silva</span><br><br>
      <span class="lsize2">Her Summerised Life</span><br>
      </p>
   </div><br><br>
  <div>
     <p class="animate1"><br><span class="lsize3 animate1">She is a music teacher, poetess
      lyricist, oil panter, social worker. <br><br>
    I thought of dedicating this page to my family, friends
     with summary of my life and post my most of the poems, songs,
      paints, work that did too. Selecting the appropriate
  item from Menu, you can navigate</span></p>         
  </div><br>
  <div id="sheader"><img src="nerdyowl1.png" height="500px" width="aut]o" alt=""/>
      <span class="lsize5">Who I am or Who she is</span>   
  </div>
  <div class="reveal" id="container">
      <img class="owl1" src="earlylife.png" alt="" width="60" height="auto" alt="A "/>
         <p><br><span class="lsize1">Early life and Education</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Est eaque
       numquam, id consequatur aut, accusamus repudiandae ratione facilis
       iusto deserunt beatae modi sequi doloribus! Velit!</p>
  </div>
  <div class="reveal" id="container">
    <img class="owl1" src="lifejourney.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">Childhood and Education</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam,
       inventore aut. Perferendis sint voluptate dignissimos explicabo optio
       exercitationem asperiores aliquid laboriosam iste, quaerat error,<br><br>
        ad enim eaque facilis distinctio eius quae dolorem est consectetur
         in. Suscipit velit adipisci autem, modi, quo cumque, quis aut
         deleniti quasi magnam illum. Saepe animi iure laborum deserunt
         ipsa suscipit.</p>
  </div>
  <div class="reveal" id="container">
    <img class="owl1" src="protocol.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">Career</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam,
      inventore aut. Perferendis sint voluptate dignissimos explicabo optio
      exercitationem asperiores aliquid laboriosam iste, quaerat error,<br><br>
       ad enim eaque facilis distinctio eius quae dolorem est consectetur
        in. Suscipit velit adipisci autem, modi, quo cumque, quis aut
        deleniti quasi magnam illum. Saepe animi iure laborum deserunt
        ipsa suscipit.
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam,
        inventore aut. Perferendis sint voluptate dignissimos explicabo optio
        exercitationem asperiores aliquid laboriosam iste, quaerat error,<br><br>
         ad enim eaque facilis distinctio eius quae dolorem est consectetur
          in. Suscipit velit adipisci autem, modi, quo cumque, quis aut
          deleniti quasi magnam illum. Saepe animi iure laborum deserunt
          ipsa suscipit.</p>
  </div>
  <div class="reveal" id="container">
    <img class="owl1" src="projects.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">Marriage</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>We love to help our clients with their needs which sometimes translates
       into unique projects.  From creating dashboards that reflect your KPIs, to
       building spreadsheets to use in your daily activities – if it involves
       numbers, we are here for it and happy to help.</p>
  </div>
  <div class="reveal" id="container">
    <img class="owl1" src="setup.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">Phylanthrophy</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>We want our clients to be set up for success from day one.  We offer a
        complete Set-up package that includes:<br>
        * Integration with platforms used in your business <br>
        * Process creation for all financially related tasks<br>
        * Custom Chart of Accounts<br>
        * Payroll set-up<br>
        * Tax compliance review <br></p>
  </div>
  <div class="reveal" id="container">
    <img class="owl1" src="renovation.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">Anything or delete the section</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>Sometimes a set of books will need an overhaul in order for
       them to be compliant, consistent and informative.  Let us
        help re-create your books with a proper foundation and
       improved practices to move forward with.</p>
  </div>
  <div class="reveal"  id="container">
    <img class="owl1" src="transition.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">What ever </span></p>
  </div> 
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>There have been many evolutions in accounting practices even over the
         past few years.  We are here to help implement a successful accounting
        migration; moving your business away from a desktop and shoebox full of
        receipts and onto cloud-based accounting platforms that will streamline
        what you do and how you do it.</p>
  </div>
  <div class="reveal" id="container">
    <img class="owl1" src="hlinks.png" alt="" width="60" height="auto" alt="A "/>
       <p><br><span class="lsize1">Whatever</span></p>
  </div>
  <button class="collapsible"  onclick="rotate1()">Click for details
    <img src="blacka.png" alt="image" class="normal"
    id="darrow"/></button>
  <div class="content">
    <p>Coming soon</p>
  </div>
  <br>

  <div id="sheader"><img src="nerdyowl.png" height="30px" width="auto" alt=""/>
    <span class="lsize5">Photos in different stages</span>
  </div><br>
  <center><img class="reveal" src="sterling.png" alt="" width="200" height="auto" alt="A "/>
  </center><br><br><br>
 
  <div id="sheader"><img src="nerdyowl.png" height="30px" width="auto" alt=""/>
    <span class="lsize5">Contact Me</span>
  </div>
 
  <center>
    <span><a href="contact.php" class="asub">
      <img class="reveal"  src="contact1.png"></a>
    <a href="https://www.facebook.com/The-Nerdy-Owl-105167178847359 target=blank">
      <img class="reveal2" src="facebook.png"></a>
  </span>
  </center><br>
  <center>
    <p class="lsize6">[email protected]</p>
  </center><br>
      
</div>
 
<script src="overlay.js"></script>
<script src="collapsible.js"></script>

 </body>
 </html>

I have attached the code.
 

Attachments

  • image2.png
    image2.png
    72.6 KB · Views: 0
Another person using, Samsung Galaxy says the following.
1. Enter www.sis.anura7.ca gives the page as expected. Then, has pressed the Menu on top.
2. It has not appeared overlying the webpage.
3. When he slide with fingers to the right, it has shown the Menu with items.

Is there a way to fix this. Thanks for the helps.
 
Back
Top Bottom