Click here to Skip to main content
15,305,517 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
PHP
<?php
session_start();
if(!isset($_SESSION["id"])){
    header("Location:http://localhost/petanimals/login.php");

};
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="user_personal_page.css">
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,400;0,500;0,600;0,700;1,100;1,400;1,500;1,600;1,700&family=Pattaya&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="fontawesome/css/all.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.3/css/fontawesome.min.css" integrity="undefined" crossorigin="anonymous">
</head>
<body>
    <div id="head">
         <?php include 'head.php' ?>
    </div>
    <?php  
    
    $id=$_SESSION["id"];
     $conn=mysqli_connect("localhost","root","","pet_animals") or die("connect failed");
     $sql="SELECT * FROM user_profile WHERE id=$id ";
     $result=mysqli_query($conn,$sql)  ;
     if(mysqli_num_rows($result)>0){

    while($row=mysqli_fetch_assoc($result)){

 

    ?>
    <div id="container">
        <div id="name">
        <div class="profile">
      
        
        <img src="user_images\<?php echo $row['profile_pic'];?>" alt="">
        </div>
            <div>
                <h2><?php echo $row['fname'] ." ". $row['lname'] ?></h2>
                <h3>Full Name</h3>
                <h3><?php echo $row['city']  ?></h3>
                <a href="edit_profile_page.php"><h3>Edit profile</h3></a>
            </div>
        </div>
        <div id="about">
            <h2>About info</h2>
            <p>
            <?php echo $row['info'] ?>
            </p>
        </div>
       <?php 
     };  };
       ?> 


     <div id="heading">
        <a href="./add_product_page.php">
              <h3>Add Products</h3> </a>
          </div>
        <div id="products">
        <div class="productcontainer">
        <div class="productbox">
          <div class="imagebox">
          <div class="imagecontainer">
             <a href="IMAGES\fish.jpg"> <img src="IMAGES\fish.jpg" alt="" id="img"></a>
             <a href=""><img src="IMAGES/petaccess4.jpg" alt=""></a>
             <a href=""><img src="IMAGES/rabbithead.webp" alt=""></a>
             <a href=""><img src="IMAGES/petaccess3.png" alt=""></a>
             <a href=""><img src="IMAGES/fishhead.jpg" alt=""></a>
           </div>
          </div>
         
        
           <div class="detailscontainer">
               <div class="pricebox">
                   <h4>Rabbit</h4>
                   <h4>PRICE-2730Rs</h4>
                   <a href="product_detail_page.php"><h4>Rabbit</h4></a>
               </div>
               <div class="clickbtn">
                   <input type="submit" value="ADD TO THE CART" class="submit">
                   <input type="submit" value="ADD TO THE WISHLIST" class="submit">
               </div>
               <div class="sellerdetails">
                   <div class="seller">
                       <img src="IMAGES\fb icon.png" alt="">
                       <h4>Nandini Srivastava</h4>
                   </div>
                   <div class="readmore">
                      
                   <a href="">Edit</a>
                   <a href="">Delete</a>
                   </div>

               </div>
           </div>
           </div>
        </div>
       
    </div>
    
  
    <?php include 'footer.php' ?>
</body>
</html>


CSS
* {
    padding: 0;
    margin: 0;
    font-family: 'Josefin Sans', sans-serif;
}

body {
    overflow-y: scroll;
    overflow-x: hidden;
}

#head {
    background-color: black;
    height: 80px;
    width: 100%;
}

#container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 1400px;
    padding: 20px;
    margin: 50px;
}

#name {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.profile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    margin-left: 20px;
    height: 200px;
    width: 200px;
    border-radius: 50%;
    margin-right: 50px;
}

.profile img {
    height: 200px;
    width: 200px;
    border-radius: 50%;
}

#name div h2 {
    height: 20px;
    padding: 10px;
    width: 350px;
    background-image: linear-gradient(black, grey, white, white, grey, black);
    border: 1px solid black;
}

#name div h3 {
    margin-top: 6px;
}

#about {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 20px;
    border: 2px solid yellow;
    margin-left: 20px;
    margin-top: 30px;
    background-image: linear-gradient(yellow, rgb(238, 238, 155), white, white, rgb(238, 238, 155), yellow)
}

#about h2 {
    margin-bottom: 10px;
}

#products {
    width: 100%;
    height: 1500px;
    overflow-y: scroll;
    overflow-x: hidden;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

#heading {
    padding: 10px;
    background-image: linear-gradient(red, pink, white, white, pink, red);
    border: 2px solid red;
    margin: 20px;
}

#heading a {
    text-decoration: none;
}

#heading a:hover {
    color: red;
}

.productcontainer {
    height: 500px;
    width: 260px;
    padding: 20px;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 20px;
    border-radius: 3px;
    transition: 0.2s;
}

.productcontainer:hover {
    box-shadow: 2px 2px 5px rgb(0, 0, 0, 0.5), -2px -2px 5px rgb(0, 0, 0, 0.5), 2px -2px 5px rgb(0, 0, 0, 0.5), -2px 2px 5px rgb(0, 0, 0, 0.5);
}

.productcontainer div {
    margin-top: 15px;
}

.imagecontainer {
    height: 200px;
    width: 260px;
    overflow-x: scroll;
    overflow-y: hidden;
    display: flex;
    flex-direction: row;
}

.imagecontainer img {
    height: 200px;
    width: 260px;
}

.pricebox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

.pricebox a {
    font-size: 18px;
    text-decoration: none;
}

.pricebox a:hover {
    font-weight: bold;
    color: red;
}

.pricebox h4 {
    margin-bottom: 10px;
}

.clickbtn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.submit {
    outline-style: none;
    height: 25px;
    padding: 5px;
    background-color: rgb(236, 164, 68);
    border: 1px solid black;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.submit:hover {
    background-image: linear-gradient(white, rgb(236, 164, 68), rgb(236, 164, 68), white);
    border: 1px solid rgb(236, 164, 68);
}

.seller {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.seller img {
    height: 40px;
    width: 40px;
    border-radius: 50%;
    margin-right: 10px;
}

.readmore {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
}

.readmore a {
    font-weight: bold;
    font-size: 18px;
    text-decoration: none;
}

.readmore a:hover {
    font-weight: bold;
    color: red;
}

#logout a h3 {
    padding: 10px;
    border: 3px solid black;
    margin: 100px;
    width: 150px;
    display: flex;
    justify-content: center;
}

#logout a {
    text-decoration: none;
}

#logout a h3:hover {
    color: red;
    border: 3px solid red;
    text-decoration: underline 2px red;
}


What I have tried:

I was developing an ecommerce website but I got troubled by this error since last 4 days . I don't know why some of my anchor tags are not working and behave like a static element after adding css file in the head tag . Please explain me why is this happening ? Is it a type of error of programming or any defect in my system? I have linked my code below I am working with the language HTML , CSS and PHP .
Posted
Updated 22-Jul-21 9:03am
Comments
samsmith07 25-Jun-21 9:27am
   
Create a separate class for anchor tag and u can use that when ever you need that.

1 solution

There is no way for us to know for sure because we cannot see your page. However, all you have to do is use the developer tools to see what is going on. It is quite possible you are loading some css that is changing the styles of anchor tags. Or you are loading something into the header that is not properly formed and that is causing the rest of the page to not load correctly.

Use your developer tools and you should be able to figure it out.
   

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month


CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900