Organizar o topo da página

+3
Firenando
Shek
Alex Habilidade
7 participantes

Ver o tópico anterior Ver o tópico seguinte Ir para baixo

Tópico resolvido Organizar o topo da página

Mensagem por Alex Habilidade 16.11.13 21:36

Qual é minha questão:
Olá a todos

Estou organizando o topo do meu fórum, pois alterei a logo etc...
Está ocorrendo alguns bugs, eu tentei por conta própria arrumar porém não houve resultado algum.
O primeiro é o menu que eu centrei em um local na logo e fiz esse procedimento utilizando o navegador mozilla FireFox e pegou perfeito e em seguida fiz o teste outros navegadores "chromer, opera" e o menu não esta centrado corretamente. O anúncio do fórum depois que fiz essa modificação, ele simplesmente bugou.
Vejam a imagem a seguir:
https://i.servimg.com/u/f55/14/99/55/84/bug110.jpg

- Eu marquei em vermelho para vocês verem!

Alguém ajuda?

Endereço do meu fórum:
http://gzhabilidade.foroactivo.com.mx

Versão do fórum:
PUNBB
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Convidado 16.11.13 22:31

Olá amigo,

Utilize este código no começo de sua CSS:
#pun-head {position: fixed;top: 0;left: 0;width: 100%;}
Vermelho > Altere o valor até que fique em posição que lhe deseja.

Atenciosamente.

Anonymous

Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 17.11.13 0:54

Olá Nikou, não resultou.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Organizar o topo da página

Mensagem por Shek 17.11.13 14:01

Bom dia!

Este problema não acontece em meu navegador: https://i.servimg.com/u/f57/16/63/75/54/united10.jpg

Você confirma sua que sua versão do Chrome esteja atualizada? O tamanho do seu monitor é 1280x720?

Atenciosamente,
Shek
Shek

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Firenando 17.11.13 14:21

Olá, o problema é que você usou Porcentagem [%] para uma resolução 1336x768, então querendo ou não, vai mudar nas outras resoluções.
Programe com PX, será mais fácil...
Firenando

Firenando
Super Membro

Membro desde : 22/10/2011
Mensagens : 1665
Pontos : 2318

http://divineartz.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 17.11.13 16:35

Olá Shek, eu testei em 4 computadores, pedi print de 5 pessoas e os menus estão sempre desalinhados.
Acho que seja algum CSS, poderia ajudar-me em organiza-los?
Digo que seja algo de errado porque a opção de anúncios também está com problemas, acho que é algo influenciando o topo da página.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 18.11.13 10:48

Up
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 19.11.13 10:25

Up!
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Principal Contribuidor

Tópico resolvido Re: Organizar o topo da página

Mensagem por Shek 19.11.13 15:13

Boa tarde!

Vamos fazer o possível. Você pode me fornecer o seu código CSS?

Até mais.
Shek

Shek
Principal Contribuidor
Principal Contribuidor

Membro desde : 11/04/2009
Mensagens : 18896
Pontos : 22793

https://shiftactive.blogspot.com/ https://www.facebook.com/ShiftActif https://twitter.com/ShiftActif

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 19.11.13 18:11

Olá,

Aqui está:
Código:

#pun-head #pun-navlinks {
-webkit-margin-before: -40px;
margin-top: -94px;
position: absolute!important;
margin-left: 250px;
}

.main-head .page-title h2 {
{
    background: none repeat scroll 0 0 #000000;
    border: 1px solid #0F6600;
    border-radius: 10px 10px 0 0;
    float: left;
    font-size: 12px;
    height: 15px;
    margin-top: -15px;
    padding: 9px;
}

}
/*avatar na barra de ferramentas*/
            .fa_avatar {
              width: 25px;
              height: 25px;
              position: relative;
              top: -3px;
              margin-right: 5px;
              border-radius: 3px;
              margin-bottom: -10px;
            }

.anuncios {
height: 50px;
font-size: 20px;
}
#fa_ticker_content{
padding: 40px; 
}
#fa_ticker {
margin-top: 38px;
padding-bottom: 40px;
  height: 50px;
}

#container {
 margin-top: 95px;
}

#right {
margin-top: 100px; 
}

#pun-announcement {
margin-top: -2px!important;
}

#pun-intro {
height: 280px!important;
  padding-bottom: 280px!important;
}
#pun-head #pun-navlinks {
background-color: transparent;
}
#pun-navlinks li a {
color: #ffffff;
font:bold 13px tahoma,Arial,Helvetica,sans-serif;
  float;left;
}

.main .main-head {
  margin-top: 25px;
 background-image:url('http://i.imgur.com/WfS05Ci.png');
background-repeat: x-repeat;
padding: 15px;
  height: 16px;
  border-radius: 15px 10px 0px 0px;
  border:1px solid #04BD00!important;
}
.codebox {
background-color: #ffffff;
  color: #000000;
}

/*chatbox*/
        #chatbox, #chatbox_footer, #chatbox_members {
        background: #1a1a1a;
        border-top: 1px solid #EAEAEA; 
        }

        #chatbox_header.main-head {
        background: #31485C url('') repeat-x 50% 0;
        color: white;
        text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0px;
        padding: 2px;
        font-size: 12px;
        -webkit-box-shadow: inset rgba(255, 255, 255, 0.15) 0px 0px 0px 1px;
        -moz-box-shadow: inset rgba(255,255,255,0.15) 0px 0px 0px 1px;
        box-shadow: inset rgba(255, 255, 255, 0.15) 0px 0px 0px 1px;
        overflow: hidden;
        font-weight: 300;
        }

        .chatbox-title, .chatbox-title a.chat-title {
          color: white;
        font-size: 12px;
        font-weight: bold;
        }

        h2.chatbox-title:after { content: "Gz Habilidade Chatbox"; }
        a.chat-title { display: none; }

        .chatbox-options li, .chatbox-options li a, .chatbox-options li label {
        color: white;
        }

        #chatbox_members .member-title {
        background: #1a1a1a;
        background-color: #F4F9FD;
        background-image: none;
        border-bottom: 2px solid red;
        color: #A30000;
        font-family: Verdana,Arial,Helvetica,sans-serif;
        font-size: 12px;
        padding: .5em .25em;
        text-align: center;
        text-shadow: 1px 0 0 white;
        }

        #chatbox_members {
        background: white url(http://www.addthis.com/forum/styles/addthis2/theme/images/whosonline.gif) no-repeat 8px -3px;
        border-bottom: ;
        display: none;
        }

        div.main-content.chatbox.clearfix {
        border: 1px solid #04BD00;
        border-radius: 4px;
        }

        #chatbox p {
        background: #212121 url(http://i13.servimg.com/u/f13/18/08/31/55/tdn10.png) repeat-x left top;
        line-height: 1.2em;
        }

        #chatbox_footer {
          margin-top: 0px;
          width: 290px;
          min-width: 230px;
          background: #1a1a1a;
          float: right;
          clear:both;
          position: relative;
          border-top: 1px solid #161616;
        }

        .right {
        clear: both;
        float: right;
        }

        input#message.post {
        height: 45px;
        width: 240px;
        padding: 6px;
        border: 1px solid #383838;
        background: #292929;
        color: #B7B7B7;
        text-shadow: rgba(0, 0, 0, 0.3) 0px -1px 0px;
        -webkit-box-shadow: inset rgba(0, 0, 0, 0.2) 0px 1px 4px;
        -moz-box-shadow: inset rgba(0,0,0,0.2) 0px 1px 4px;
        box-shadow: inset rgba(0, 0, 0, 0.2) 0px 1px 4px;
        margin: 20px;
        margin-bottom: 0px;
        }

        input#message.post:focus {
          outline:none;
          background-color:#4b4b4b;
          color:#f8f8f8;
          border-color:#797979
        }

        #message, #submit_button {
          background: #323232 url('http://lifegames.in/forum/public/style_images/LifeGames_v2_0/highlight_faint.png') repeat-x 0 0;
        border-color: #2B2B2B;
        color: white;
        text-shadow: #2B2B2B 0px -1px 0px;
        -moz-box-shadow: rgba(0,0,0,0.43) 0px 1px 3px;
        -webkit-box-shadow: rgba(0, 0, 0, 0.43) 0px 1px 3px;
        box-shadow: rgba(0, 0, 0, 0.43) 0px 1px 3px;
        -moz-border-radius: 2px;
        padding: 5px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        display: block;
        margin: 10px;
        margin-top: 0px;
        margin-left: 20px;
        }

        #message, #submit_button:hover {
          opacity: 0.9;
        }

        .fontbutton {
        background: #646464 url('http://lifegames.in/forum/public/style_images/LifeGames_v2_0/highlight_faint.png') repeat-x 0 0;
        border: 1px solid #585858;
        color: white;
        text-shadow: #474747 0px -1px 0px;
        -moz-box-shadow: rgba(0,0,0,0.43) 0px 1px 3px;
        -webkit-box-shadow: rgba(0, 0, 0, 0.43) 0px 1px 3px;
        box-shadow: rgba(0, 0, 0, 0.43) 0px 1px 3px;
        border-radius: 2px;
        color: black;
        cursor: pointer;
        float: left;
        margin: 3px;
        padding: 3px;
        margin-right: 10px;
        text-align: left;
        }

        .fontbutton:hover {
          opacity: 0.9;
        }

        #divsmilies img + img{visibility:visible!important}

        #chatbox_messenger_form div.right img{visibility:hidden}

        #simple-wrap {
          background:white;
        }

        #divbold, #divcolor, #divitalic, #divsmilies, #divstrike, #divunderline {
        background-position: center;
        background-repeat: no-repeat;
        }

        #divbold {
        background-image: url(http://cdn2.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-bold.png);
        }

        #divitalic {
        background-image: url(http://cdn2.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-italic.png);
        }

        #divunderline {
        background-image: url(http://cdn2.iconfinder.com/data/icons/oxygen/16x16/actions/format-text-underline.png);
        }

        #divstrike {
        background-image: url(http://cdn1.iconfinder.com/data/icons/bnw/16x16/actions/text_strike.png);
        }

        #divcolor {
        background-image: url(http://2img.net/i/fa/wysiwyg/color_swatch.png);
        }

        #divsmilies {
        background-image: url(http://i26.servimg.com/u/f26/12/56/56/12/emotic10.png);
        }

        #chatbox{
          background: #333;
          padding: 8px;
          border: 1px solid #222222;
          margin-top: 4px;
          margin-right: 290px;
          left:0
        }

        .attach {
        float: right;
        }
/*like*/
    .LGlike {
    background: url(http://i11.servimg.com/u/f11/18/07/42/17/ok12.png) no-repeat left;
    background-color: #326A94;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 2px 2px 2px 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0 rgba(255, 255, 255, 0.3) inset;
    color: white;
    cursor: pointer;
    display: inline-block;
    font-size: 11px;
    height: 22px;
    line-height: 22px;
    padding: 0 18px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    white-space: nowrap;
    margin-right: 5px;
    margin-top: 30px;
    }
    .LGvote { margin: 0 5px; }
    .LGnovote {
      filter:Alpha(opacity=50);
      opacity: 0.5;
      cursor: default;
      box-shadow: none;
      text-shadow: none;
    }

#pun-announcement {
  border: 4px ridge #04BD00;
  border-radius: 3px 3px 3px 3px;
  font-family: helvetica,arial,sans-serif;
}

.main .frm-info, .pun .main .main-content p.message {
    background: none repeat scroll 0% 0% rgb(28, 28, 28);
    border-width: 1px 1px 3px;
    border-style: solid;
    border-color:  rgb(17, 17, 17);
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    box-shadow: 0px -1px 2px rgb(247, 200, 0), 0px 1px 1px rgba(255, 255, 255, 0.1) inset;
    font-size: 15px;
    line-height: 1.5;
    text-shadow: 0px 2px 0px rgb(0, 0, 0);
}
#onlinechat {
border-top: 1px solid #474747; 
}

.main .main-foot, .main .main-head {
background-color: #000000;
  border-bottom: 1px solid #04BD00;
  border-left: 1px solid #04BD00;
  border-right: 1px solid #04BD00;
}

#onlinelist {
border-top: 1px solid #04BD00;
  border-bottom: 1px solid #04BD00;
}

.pun .frm dd.frm-input, .pun .frm dd.frm-input input, .pun .frm dd.frm-textarea {
width: 75%;
  background-color: #000000;
  color: #ffffff;
  heigth: 19px;
  border-color: #474747;
  border-radius: 1px 1px 1px 1px;
}

#smiley-box {
margin-left: 80px; 
}

.sub-head {
border-bottom: 1px solid #000000; 
}
fieldset.frm-set {
border-bottom: 1px solid #04BD00;
border-top: 1px solid #04BD00;
border-left: 1px solid #04BD00;
border-right: 1px solid #04BD00; 
}
fieldset.frm-set.multi {
border-bottom: 1px solid #04BD00;
border-top: 1px solid #04BD00;
border-left: 1px solid #04BD00;
border-right: 1px solid #04BD00; 
}

.crumbs {
display: none; 
}

.frm-buttons {
border-top: 1px solid #000000; 
}

.pun .postmain {
border-left: 1px solid #04BD00; 
}

.postfoot {
border-top: 1px solid #000000; 
}
.pun .posthead {
border-bottom: 1px solid #04BD00;
  border-top: 1px solid #04BD00;
}

/*perfil em quadros*/
.post_field {
background: #1a1a1a;
color: #DDD;
border: 1px solid #333;
padding: 3px 7px;
}
/*rank do Desenvolvedor*/
.userBanned, .userClient, .userDesigner, .userManagement4, .userMember, .userMemberactive, .userModerator, .userStaff, .vipBS {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #65a830;
    border-radius: 3px;
  border: 1px solid #474747;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    margin-top: 5px;
    padding: 3px 8px;
    text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
    }

    .userManagement4 {
    background: #FF0000;
    }
/*rank do organizador*/
.userBanned, .userClient, .userDesigner, .userManagement2, .userMember, .userMemberactive, .userModerator, .userStaff, .vipBS {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #65a830;
    border-radius: 3px;
  border: 1px solid #474747;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    margin-top: 5px;
    padding: 3px 8px;
    text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
    }

    .userManagement2 {
    background: #00CF1F;
    }

/*rank do moderador*/
.userBanned, .userClient, .userDesigner, .userManagement1, .userMember, .userMemberactive, .userModerator, .userStaff, .vipBS {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #65a830;
    border-radius: 3px;
  border: 1px solid #474747;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    margin-top: 5px;
    padding: 3px 8px;
    text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
    }

    .userManagement1 {
    background: #C77E00;
    }

/*rank do administrador*/
.userBanned, .userClient, .userDesigner, .userManagement, .userMember, .userMemberactive, .userModerator, .userStaff, .vipBS {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #65a830;
    border-radius: 3px;
  border: 1px solid #474747;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    margin-top: 5px;
    padding: 3px 8px;
    text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
    }

    .userManagement {
    background: #881418;
    }

/*quick avatar*/
    #quick-avatar {
        float: left;
        margin: 21px;
    }
    #quick-avatar img {
    width: 50px;
    height: 50px;
    padding: 1px;
    border: 1px solid #D5D5D5;
    background: white;
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
    }
    #quick-avatar img:hover {
      border-color: #A1A1A1;
    -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
    }

/*widget no indice*/
#content-container div#content {
    margin-right: 0px;
    }
    #right {height: 0px;}

/*modificação dentro do tópico o primeiro assunto*/
h1.ipsType_pagetitle {
font-size: 20px;
  margin-bottom: 8px;
  font-family: arial;
}

.titlebox{
        -moz-border-radius:3px;
        -moz-box-shadow:inset rgba(0,0,0,0.1) 0 1px 4px;
        -webkit-border-radius:3px;
        -webkit-box-shadow:inset rgba(0,0,0,0.1) 0 1px 4px;
        background:#000000;
        border:1px solid #04BD00;
        border-radius:3px;
        box-shadow:inset rgba(0,0,0,0.1) 0 1px 4px;
        overflow:hidden;
        padding:10px;
        text-shadow:#fff 0 1px 0
    }
    .titlebox dd{display:block}
    .titlebox dava{float:left}
    .titlebox dava a img{
        -moz-box-shadow:0 2px 2px rgba(0,0,0,0.1);
        -webkit-box-shadow:0 2px 2px rgba(0,0,0,0.1);
        background:#fff;
        border:1px solid #D5D5D5;
        box-shadow:0 2px 2px rgba(0,0,0,0.1);
        float:left;
        height:50px!important;
        padding:1px;
        width:50px!important
    }
    .titlebox dava a img:hover{
        -moz-box-shadow:0 2px 2px rgba(0,0,0,0.2);
        -webkit-box-shadow:0 2px 2px rgba(0,0,0,0.2);
        border-color:#A1A1A1;
        box-shadow:0 2px 2px rgba(0,0,0,0.2)
    }
    .ipsType_pagetitle a{font-size:23px;z-index:999}
    .desc.lighter.blend_links{color:#a4a4a4;float:left;font-size:11px}
    .desc.lighter,.desc.lighter.blend_links a{color:#A4A4A4}
    .desc,.desc.blend_links a,p.posted_info{color:#777;font-size:12px}
    .conect{display:inline-block;padding-left:5px}

    .seguir{float:right;position:relative}
    .seguir a{
        -moz-border-radius:2px;
        -moz-box-shadow:0 1px 2px rgba(0,0,0,0.1), inset rgba(255,255,255,0.7) 0 1px 0;
        -webkit-border-radius:2px;
        -webkit-box-shadow:0 1px 2px rgba(0,0,0,0.1), inset rgba(255,255,255,0.7) 0 1px 0;
        background:#ececec url(http://i45.tinypic.com/2hrd3tg.png) repeat-x 0 0;
        border:1px solid #d0d0d0;
        border-radius:2px;
        box-shadow:0 1px 2px rgba(0,0,0,0.1), inset rgba(255,255,255,0.7) 0 1px 0;
        color:#616161!important;
        cursor:pointer;
        display:inline-block;
        font-size:11px;
        height:24px;
        line-height:24px;
        padding:0 10px;
        text-shadow:#fff 0 1px 0;
        white-space:nowrap
    }
    .seguir a:hover{background-color:#f8f8f8;color:#4c4c4c}


/* botoes enviar e pre visualizar*/
.pun .frm .frm-buttons input {
    font-size: 1em;
    line-height: 1.2;
    margin-right: 1em;
    overflow: visible;
    padding: 1px 0.5em 2px;
    vertical-align: middle;
}
input[type="button"], input[type="reset"], input[type="submit"] {
    background: url("http://i.imgur.com/2VZgmST.png") repeat-x scroll center top rgb(58, 71, 82);
    border: 1px solid rgb(58, 71, 82);
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0px 1px 0px 0px rgb(92, 92, 92) inset, 0px 2px 3px rgba(0, 0, 0, 0.2);
    color: rgb(255, 255, 255);
    cursor: pointer;
    font-family: helvetica,arial,sans-serif;
    font-size: 13px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    padding: 4px 10px;
}

/*ajustamento da caixa de bbcode*/
.frm-input {
width: 650px; 
}

.frm-textarea .sceditor-container {
width: 650px; 
}

div.sceditor-toolbar {
        display: block !important;
        }
        /*Icone do BBcode*/
        .pun .main-head a.exthelp, .pun .main-head a.exthelp:link, .pun .main-head a.exthelp:visited {
          background-image: url(http://i36.servimg.com/u/f36/11/96/49/61/script10.png);}

       
        /*quem está conectado*/
        .i_icon_online {position: relative !important;top: -352px;left: 155px;}

        /*efeito nos botoes*/
        #search-box input.button2:hover, a.button1:hover, a.button2:hover, button.button2:hover, input.button1:hover, input.button2:hover {
        background-position: 0 100%;
        border: 1px solid #2788F5!important;
        box-shadow: 1px 1px 5px!important;
        color: #06c42c!important;
        }
        #search-box input.button2, a.button2, input.button1, input.button2 {
        background-color: whiteSmoke;
        background-image: url(http://2img.net/i/fa/optimisation_fdf/fr/bg_buttons.png);
        background-repeat: repeat-x;
        border: 1px solid #adf0bb;
        border-radius: 2px;
        box-shadow: 1px 1px 1px;
        color: #666!important;
        cursor: pointer;
        font-size: 11px;
        font-weight: 700;
        height: 24px;
        line-height: 27px;
        margin: 5px 6px;
        padding: 0 8px!important;
        text-align: center;
        }
        #search-box input {
        background: none repeat scroll 0 0 white;
        border: 1px solid #D9D9D9;
        color: black;
        height: 20px;
        }
        #search-box input.button2:hover, a.button1:hover, a.button2:hover, button.button2:hover, input.button1:hover, input.button2:hover {
        background-position: 0 100%;
        border: 1px solid #2788F5!important;
        box-shadow: 1px 1px 5px!important;
        color: #2788F5!important;
        }
        a.button1:hover, a.button2:hover, button.button2:hover, input.button1:hover, input.button2:hover {
        background-position: 0 100%;
        border: 1px solid #FF8A00;
        color: #FF8A00;
        }
        #search-box input.button2, a.button2, input.button1, input.button2 {
        background-color: whiteSmoke;
        background-image: url(http://2img.net/i/fa/optimisation_fdf/fr/bg_buttons.png);
        background-repeat: repeat-x;
        border: 1px solid #adf0bb;
        border-radius: 2px;
        box-shadow: 1px 1px 1px;
        color: #666!important;
        cursor: pointer;
        font-size: 11px;
        font-weight: 700;
        height: 24px;
        line-height: 27px;
        margin: 5px 6px;
        padding: 0 8px!important;
        text-align: center;
        }
        a.button2, body:last-child a.button1, button.button2, input.button1, input.button2 {
        padding: 1px 0;
        }
        a.button1, a.button2, button.button2, input.button1, input.button2 {
        background-color: #FAFAFA;
        background-image: url(http://2img.net/i/fa/prosilver/bg_button.gif);
        background-position: top;
        background-repeat: repeat-x;
        color: black;
        font-family: Verdana,Arial,Helvetica,sans-serif;
        overflow: visible;
        padding: 2px 3px;
        width: auto!important;
        }
        a.button2, button.button2, input.button2 {
        border: 1px solid #BCBCBC;
        }
        button.button2, input.button1, input.button2 {
        font-size: 1em;
        }
        input {
        cursor: pointer;
        font-family: Verdana,Arial,Helvetica,sans-serif;
        font-size: 1em;
        font-weight: 400;
        padding: 0 3px;
        vertical-align: middle;
        }

        #search-box input.button2 {
            background-color: #F5F5F5;
            border: 1px solid rgba(0, 0, 0, 0.1);
            border-radius: 2px 2px 2px 2px;
            color: #666666;
            cursor: pointer;
            font-size: 11px;
            font-weight: 700;
            height: 29px;
            line-height: 27px;
            margin: 11px 6px;
            min-width: 54px;
            padding: 0 8px;
            text-align: center;
        }
        p.nomargin {
            font-size: 1.1em;
            line-height: 1.3em;
            margin-bottom: 0;
        }

        #search-box #keywords {
            background-color: #FFFFFF;
            width: 95px;
        }

        #search-box input {
            -moz-box-sizing: content-box;
            background: none repeat scroll 0 0 #FFFFFF;
            border: 1px solid #D9D9D9;
            color: #000000;
            height: 23px;
        }

        #search-box {
            float: right;
            margin-right: 5px;
            margin-top: 10px;
            white-space: nowrap;
        }
        #search-box{margin-bottom:5px}search-box input.button2{-webkit-border-radius:2px;-webkit-user-select:none;background-color:#f5f5f5;background-image:-o-linear-gradient(top,whiteSmoke,#F1F1F1);border:1px solid rgba(0,0,0,0.1);border-radius:2px;color:#666;cursor:pointer;font-size:11px;font-weight:700;height:29px;line-height:27px;margin:11px 6px;min-width:54px;padding:0 8px;text-align:center}#search-box input{-moz-box-sizing:content-box;background:#fff;border:1px solid #D9D9D9;border-width:1px;color:#000;height:23px}#search #keywords:focus{width:290px}#search #keywords{-moz-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out;width:150px}
        /*Cores nos anúncios*/
        .lastpost{-moz-border-radius:6px;-moz-box-shadow:0 0 5px #00AA00;-webkit-border-radius:6px;-webkit-box-shadow:0 0 5px #00AA00;border:1px solid #00AA00;border-image:initial;border-radius:5px;box-shadow:0 0 7px #00AA00;margin:3px;width:auto}


        /*Citação e Spoiler*/
        .postmain blockquote cite {
        color: #2788F5;
          font-family: Verdana,Arial,Helvetica,sans-serif;
        font-size: 11px;
          border-radius: 1px 1px 1px 1px;
          border: 1px solid #000000;
          padding: 10px;
        }

        .postmain blockquote {
        background-color: #474747;
        border-radius: 20px 0px 20px 0px;
        border: 1px solid #ff0000;
        font-family: Verdana,Arial,Helvetica,sans-serif; 
        }

        .spoiler_content{
        color: #2788F5;
          font-family: Verdana,Arial,Helvetica,sans-serif;
        font-size: 11px;
          border-radius: 1px 1px 1px 1px;
          border: 1px solid #000000;
          padding: 10px;
        }

        .main .frm-info {
        background-color: #000000;
        border-color:#474747;
        color: #ff0000;
        font-family: Verdana,Arial,Helvetica,sans-serif;
        border-radius: 7px 0px 7px 0px;
          font-size: 12px;
        }

        /*informações do perfil */
        #tabs.clearfix a {
        background-color:#2B2B2B;
        border-color: #000000;
        border-radius: 5px 5px 0px 0px;
        font-family: Verdana,Arial,Helvetica,sans-serif;
          font-size: 11px;
        }

        /*numeros do post*/
            p.pag,.paging{border-radius:3px;color: white;margin: 4px 0 9px 0;}
            #blog_comments .paging,#blog_comments p.pag{color:#ffffff;}
            td p.pag a,.paging a, td p.pag b, .paging b, .paged-foot .paging a, .paged-foot .paging b, .paged-foot .paging a:hover{border-radius:3px;
            padding: 6px 9px 6px 9px !important;margin-right: 3px !important;font-size: 12px !important;}
            td p.pag a,.paging a, .paged-foot .paging a{
              border-radius:3px;
            color: #ffffff !important;
            border: solid 1px #474747 !important;
            background-color: #474747;
            background:-moz-linear-gradient(#000000,#000000);
            background-image: -webkit-linear-gradient(#F2F2F2,#BABABA);
            text-shadow: 0px 1px #EBEBEB !important;
            box-shadow: 0px 1px #D4D4D4 !important;-moz-box-shadow: 0px 1px #D4D4D4 !important;-webkit-box-shadow: 0px 1px #D4D4D4 !important;}
            td p.pag b, .paging b, td p.pag a:hover, .paging a:hover{
              border-radius:3px;
              border: solid 1px #474747 !important;
            color: #000000 !important;
            background-color: #58E862;
            background:-moz-linear-gradient(#474747,#474747);
            background-image: -webkit-linear-gradient(#BABABA,#DBDBDB);
            text-shadow: 0px 1px #666666 !important;
            box-shadow: 0px 1px #D4D4D4 !important;-moz-box-shadow: 0px 1px #D4D4D4 !important;-webkit-box-shadow: 0px 1px #D4D4D4 !important;}
            p.pag img,.paging img,.paged-foot .paging img{postion:relative;top:-3px;margin-top:-5px!Important;vertical-align: center !important;}
       
        /*efeito no link, mudando de cor lentamente*/
        a:hover {color: #2788F5!important;text-decoration: none!important;}
        a {-moz-transition-duration: .8s;-o-transition-duration: .8s;-webkit-transition-duration: .8s;font-family: Oxygen, sans-serif;text-decoration: none!important;transition-duration: .8s;}


        /*efeito flutuante no novo e responder*/
        .pun .paged-foot, .pun .paged-head {background:transparent !important;border:none!important;}

        /*efeitos nas bordas das categorias*/
        .main .main-head {
        border-radius: 5px 5px 0px 0px;
        border: 1px solid #04BD00;
        background-color: #000000;
          padding: 10px;
        }

        .main .main-content{
        border-radius: 0px 0px 4px 4px;
          border: 1px solid #04BD00;
          background-color: #000000;
        }

        .pun table.table td {
        background-color: #000000;
  border:1px solid #04BD00!important;
        }



        /*Caixa de Smileys*/
        #smiley-box {
        padding: 11px;
        border: 1px solid #474747;
  width: 650px;
  heigth: 320px;
            }

        /*arrumar os caminhos dos tópicos*/
        div.pun-crumbs.noprint{font-size:0px;height:32px}div.pun-crumbs.noprint p.crumbs{display:inline}div.pun-crumbs.noprint a{background:url(http://i42.servimg.com/u/f42/17/32/13/00/second10.png) no-repeat 100% -1px;color:#04BD00!important;font-size:11px;line-height:30px;padding:9px 19px 11px 10px;font-weight:normal}div.pun-crumbs.noprint p.crumbs a.nav:last-child{display:none}div.pun-crumbs.noprint strong a{background:url() transparent}


        /*remover a busca no fim da página*/
        #pun-about #qjump{display:none!important}

        /*remover o titulo da categoria escrito fórum*/
        .main .main-content .table thead tr {
        display: none;
        }


        /*remvoer as linhas das categorias*/
        .pun table.table td {
        border: 1px solid #242323; 
        }

        /*Copyright*/
        #copyright2 a {
        text-decoration: none; 
        }

        .ipsList_inline {
        font-size: 11px;
          color: #474747;
          font-family: Verdana;
          text-align: center;
          margin-top: 35px;
          border: 1px solid #474747;
          border-radius: 2px 2px 2px 2px;
        }

        #backtotop:hover, #bottomScroll:hover {
            background: none repeat scroll 0% 0% rgb(48, 48, 48);
            color: rgb(255, 255, 255);
            opacity: 1;
        }

        #backtotop, #bottomScroll {
            background: none repeat scroll 0% 0% rgb(189, 189, 189);
            border-radius: 16px 16px 16px 16px;
            box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.7) inset;
            display: inline-block;
            height: 24px;
            left: 50%;
            line-height: 20px;
            margin-left: -12px;
            margin-top: -20px;
            opacity: 0.4;
            outline: 0px none;
            position: absolute;
            text-align: center;
            top: 50%;
            width: 24px;
        }

        #footer_utilities {
        height: 35px;
        margin: -5px;
        padding: 8px;
        position: relative;
        border-top: 1px solid #2A2A2A;
        text-shadow: rgba(0, 0, 0, 0.8) 0px -1px 0px;
        background: #000000 url('') repeat-x 0 -1px;
        }

        #footer_utilities .ipsList_inline > li > a {
        color: #848484;
        margin-right: 0px;
        padding: 4px 10px;
        display: inline-block;
        }

        #footer_utilities .ipsList_inline > li {
        margin: 0;
        }

        #copyright {
        text-align: right;
        line-height: 22px;
        float: right;
        }

        #copyright a {
          color: #474747;
          text-decoration:none;
        }

        #pun-about ul {
        margin-right: 230px; 
        }

        #pun-about ul li a {
          color: #9c9c9c;
          text-decoration: none;
          font-size: 8px;
          font-family: Verdana,Arial,Helvetica,sans-serif;
        }

        #pun-about {
          background: #000000;
          border-radius: 3px 3px 3px 3px;
          border: 1 solid #000000;
        }

        /*remover as ultimas mensagens e a busca no final da pagina*/
        #pun-visit {
        display:none; 
        }

        /*remover os top*/
        .main-box {
            display: none; 
        }

        .pun {
            background-color: #000000;
            width: 500px;
            }
        .pun {
            line-height: 130%;
            margin: 0px auto;
            min-width: 768px;
            padding: 5px;
            width: 98%;
        }

        /*aumentando a largura da logo*/
        .pun{padding-top:417px!important}#page-body{padding-top:50px!important}#pun-intro{position:absolute;top:0px;left:0px;width:98%;background-size:100%}.text-logo{left:50%;top:40px;z-index:1}

        /*logo fundo*/
        #pun-intro{background-color:#000000;background-image:url(http://i.imgur.com/nL23RkU.png);background-repeat:repeat-x;border-bottom:1px solid #75bff0;margin:0;padding-bottom:360px;text-align:left}

        /*Remover a parte do fundo da logo*/
        #pun-intro {
          background: none;
          border: 0;
          text-align: left;}
        /*borda do fórum*/
        body{background-color:#000000;background-image:url()}.pun{background:url(http://i42.servimg.com/u/f42/17/32/13/00/after-10.png) 50% 0 repeat-x #fff;border:6px solid rgba(0,0,0,0.14902)!important;border-radius:7px!important;box-shadow:rgba(0,0,0,0.14902) 0 0 8px;margin-top:5px}

Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 20.11.13 12:32

Up!
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 20.11.13 23:15

UP
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 21.11.13 13:17

Up!
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 22.11.13 11:59

Up.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por POGRAMANDO 24.11.13 1:56

Olá ,
Faça o seguinte, no navegado que esta a utilizar apague o historico todo e entre novamente no fórum.

Até Mais...
avatar

POGRAMANDO
****

Membro desde : 18/09/2013
Mensagens : 342
Pontos : 579

http://mundodosforuns.forum-pro.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 25.11.13 10:04

Olá Mundo dos Fóruns,

A primeira coisa que fiz quando me deparei com esse erro foi usar essa função do navegador porém não houve nenhum resultado. Testei em quatro computadores desde a versão antiga para a versão mais recente dos navegadores e os erros persistem em aparecer de varias maneiras.

Cordialmente;
Camaro.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 25.11.13 21:25

Up
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por JScript 25.11.13 21:29

@Camaro

Você está dando vários Ups inclusive no mesmo dia e já me enviou uma mensagem privada pedindo ajuda, onde você deseja chegar com isso?

JS

JScript

JScript
Super Membro

Membro desde : 15/03/2013
Mensagens : 1449
Pontos : 1901

http://jscript.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido #pun-head {position: fixed;top: 0;left: 0;width: 100%;}

Mensagem por Fernando Rodrigues Bueno 26.11.13 3:46

Nikou escreveu:Olá amigo,

Utilize este código no começo de sua CSS:
#pun-head {position: fixed;top: 0;left: 0;width: 100%;}
Vermelho > Altere o valor até que fique em posição que lhe deseja.

Atenciosamente.

Fernando Rodrigues Bueno

Fernando Rodrigues Bueno
Novo Membro

Membro desde : 26/11/2013
Mensagens : 1
Pontos : 1

https://www.forumeiros.com/fergabibueno@hotmail.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 26.11.13 11:32

Fernando Rodrigues Bueno escreveu:
Nikou escreveu:Olá amigo,

Utilize este código no começo de sua CSS:
#pun-head {position: fixed;top: 0;left: 0;width: 100%;}
Vermelho > Altere o valor até que fique em posição que lhe deseja.

Atenciosamente.

Olá,

Primeiramente obrigado por tentar me ajudar, mais infelizmente não resultou, os erros continuam.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por JScript 27.11.13 0:18

@Camaro

Editado: Eu acabei de verificar onde está o erro:
Código:

#pun-head #pun-navlinks {
  background-color: rgba(0, 0, 0, 0);
  margin-left: 250px;
  margin-top: -94px;
  position: absolute;
}
Isso deve-se ao fato de que você alinhou o menu na barra da imagem, neste caso a propriedade position com o valor absoluto deu o efeito desejado mas não acompanha as mais diversas resoluções de telas!

Aguarde um pouco até que possamos resolver ok?

JS


Última edição por JScript em 27.11.13 0:24, editado 1 vez(es) (Motivo da edição : Identificado o erro!)
JScript

JScript
Super Membro

Membro desde : 15/03/2013
Mensagens : 1449
Pontos : 1901

http://jscript.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 27.11.13 0:31

JScript escreveu:@Camaro

Eu confirmo o que nosso amigo @Shek afirmou em sua sentença acima: O problema relatado por você não apareceu nem mesmo em resolução de 800x600 pixels, confira:
Organizar o topo da página 2u2FcIh

JS
Olá @Jscript,

Como pode observar eu queria coloca o menu no local em verde, localizado abaixo do nome GzHabilidade, observe que em seu print o menu não aparece, no meu caso aparece veja:
Organizar o topo da página Menu10
Observe que em meu print o menu aparece abaixa da logo, no meu outro notebook o menu está localizado corretamente no local verde pois é onde eu pretendo deixar o menu.
Eu queria arrumar isto, quero que fique padrão para todos os navegadores, quero deixar o menu centrado no local verde.
Espero que me ajude colega, pois tentei de tudo, modifiquei varias vezes o meu CSS e não ouve resultado algum, também tenho templates personalizados caso queira algo.

Cordialmente;
Camaro.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por JScript 27.11.13 0:57

Eu editei a minha mensagem anterior ( https://ajuda.forumeiros.com/t86775-organizar-o-topo-da-pagina#591290 ) !

Aguarde,

JS
JScript

JScript
Super Membro

Membro desde : 15/03/2013
Mensagens : 1449
Pontos : 1901

http://jscript.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Legolass 27.11.13 1:14

Olá amigo.

Como bem disse meu professor @JScript, você colocou um absolute, e como o nome já diz ele torna um elemento absoluto, ficando por cima de tudo na tela, inclusive das divs, tabelas e etc.

Então as posições e marcações de margens são interpretadas diferentemente pelos navegadores Mozilla e Chrome.

O que você pode fazer nesse caso é editar o css para os dois navegadores, um para o Mozilla e outro para o Chrome.

O processo é bem simples, como você disse que para o Mozilla está normal e para o Chrome não, edite seu css para que fique normal no Chrome.

Depois adicione em seu css esse codigo que ficou bom no mozilla, mas desta forma:

Código:
@-moz-document {
css do mozilla aqui
}
Conseguiu compreender? Resumindo você vai adicionar dois códigos: um para mozilla e outro para os demais navegadores, por exemplo:

Código:

@-moz-document {
    #pun-head #pun-navlinks {
      background-color: rgba(0, 0, 0, 0);
      margin-left: 250px;
      margin-top: -94px;
      position: absolute;
    }
}
Esse foi para o mozilla, onde só terá efeito no mozilla.

Agora basta adicionar outro para os demais navegadores, entendeu?
Legolass

Legolass
Membro

Membro desde : 10/04/2013
Mensagens : 651
Pontos : 912

http://www.fanfictionunited.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 27.11.13 9:59

@JScript

Sim postei bem na hora que você editou. Irei aguarda-lo! Feliz

@Legolass

Perfeita explicação colega, irei aguardar o @JScript postar alguma solução para o meu caso, na próxima vez que eu iniciar um CSS irei iniciar dessa forma que o senhor explicou, obrigado Feliz

Cordialmente;
Camaro
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

  • 0

Tópico resolvido Re: Organizar o topo da página

Mensagem por JScript 27.11.13 22:51

Olá!

Eu fiz vários testes e o que mais obtive êxito foi movendo o background da tag #pun-intro para uma outra tag e modificando o atributo position para relative !

Experimente fazer isso ok? Nos dê um retorno!

Abraços,

JS
JScript

JScript
Super Membro

Membro desde : 15/03/2013
Mensagens : 1449
Pontos : 1901

http://jscript.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade 28.11.13 23:51

Olá @JScript,

Fiz exatamente conforme as explicações, passei a logo para o padrão normal da Forumeiros na categoria de gestão de imagens, depois peguei e modifiquei o menu e pegou corretamente em todos os navegadores.

Agradeço a todos e obrigado professor JScript rs!

Cordialmente;
Camaro.
Alex Habilidade

Alex Habilidade
Hiper Membro

Membro desde : 10/01/2011
Mensagens : 2795
Pontos : 3774

http://www.gzhabilidade.com/

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos