problema con position:fixed

  • Autor Autor eic2010
  • Fecha de inicio Fecha de inicio
E

eic2010

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Buenas noches les cuento que tengo en el head este codigo es una imagen y un menu

Insertar CODE, HTML o PHP:
</head>
<div class='grupo' align="center">
    
  <a href='http://www.enlace1.com' target='_blank'><img src='https://paginaweb.com/wp-content/uploads/2021/09/banner.jpg' alt='' border='0'></a>
    
    <div class='bbt-menu'>
        
        
<nav>
    <a href='https://paginaweb.com'><img  class='logo' src="https://paginaweb.com/wp-content/uploads/2021/09/eree4.png" border="0"></a>

    
  <label for='drop' class='toggle'><span0>&#9776;</span0></label>
  <input type='checkbox' id='drop' />
  <ul class='menu'>
    <li><a href='https://www.google.com.ar/'>uno 2019</a></li>
    <li><a href='https://www.google.com.ar/'>dos</a></li>
    <li><a href='https://www.google.com.ar/'>tres</a></li>
    <li><a href='https://www.google.com.ar/'>cuatro</a></li>
      <li><a><form role="search" method="get" id="searchform" class="searchform" action="https://paginaweb.com/">
                
                   <input class="sean" id="image" type="image" alt="Login"
  src="https://paginaweb.com/wp-content/uploads/2021/09/icolupa.png" style="width:19px;height:19px;margin-left:-5px;" >
                    <label class="screen-reader-text" for="s"></label>
                    <input class="sear3" type="text" placeholder="&nbsp;Buscar..." value="" name="s" id="s"/></form> </a></li>
      
    <li>
    
    
  </ul>
        
</nav>

</div>
    
</div>

 <body <?php body_class(); ?>>


que da como resultado esto:

imagen1.webp




Pero cuando quiero fijar la imagen y el menu con position:fixed; me hace esto :

CSS:
.grupo {
    position:fixed;
 
}

imagen2.webp



aca les muestro el codigo css adicional tengo


CSS:
.post-thumb {
    position: relative;
    box-sizing: border-box;
  
    background: transparent linear-gradient(180deg,#00000000 100%,#000000 100%) 0% 0% no-repeat padding-box;
    height: 100%;
}

#shadow {
  position: absolute;
    bottom: 0;
    left: 0;
    background: transparent linear-gradient(180deg,#00000000 0%,#fff 60%) 0% 0% no-repeat padding-box;
    width: 100%;
    height: 100px;
}

.post-thumb img  {
  width: 100%;
}










.wpdiscuz-form-bottom-bar  {
 display: none;
}

.wpdiscuz-front-actions {
 display: none;
}







#wpcomm .avatar {
    border-radius: 100%;
    padding: 1px;
    border: 2px solid #eee;
}

#wpcomm .wc-footer-left .wc-reply-button {
    border: 1px solid #fff!important;
    
}

article:nth-child(1) .wc-comment-text a {
    font-weight: 500;
    color:#5973c2;
}

article:nth-child(1) .wc-toggle span  {
    font-weight: 500;
    color: #E74C3C;
}

#wc-comment-header
.wpdiscuz-comment-count .wpd-cc-value {
 
    background: #E74C3C;
    color: #fff;
    font-size: 18px;
  
}
#wpcomm .wpdiscuz-readmore {
    cursor: pointer;
    color: #444444;
}










.featured-image-caption {
    font-weight: 400;   
    font-family: Georgia,Times,Times New Roman,serif;
    font-size: 18px;
    line-height: 20px;
    color: #555;
margin: 10px 5px 20px;
    text-align: center;
}


.sear2{
margin:0px 0px 5px 12px;
 
}

.toggle, [id^=drop] {
 display: none;
}

nav labe2 {
 z-index:1000; position:absolute;margin-left:0px;
}
.menu {
    margin-left:400px;
     padding: 0px 0px  10px 0px;
}
.bbt-menu{background:#fff;width:100%; ;top:0px; max-width:980px;
 }

nav ul {
    float:left;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}
nav ul li {
    margin: 0px;
    display: inline-block;
    float: left;
    
    
}

nav a, nav a:hover, nav a:visited {
    display: block;
    padding: 0 10px;
    color: #f5f5f5;
    font-size: 15px;
    line-height: 45px;
    text-decoration: none;
    margin-left:2px;   

}

nav ul ul {
    display: none;
    position: absolute;
    top: 60px;
    
}

nav label span0{
    float:right;
}

.bbt-menu li{
   background: #d12926;
}

Desde ya le agradeceria por que me estoy volviendo loco ya nose que mas hacer
 
Escribeme y envia link
 
Ya lo solucione, era problema del margin- top de los otros elementos muchas gracias!!!
 
Atrás
Arriba