Organizar o topo da página

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

Resolvido Organizar o topo da página

Mensagem por Alex Habilidade em 16/11/13, 07:36 pm

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:
http://i55.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
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Convidado em 16/11/13, 08:31 pm

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.


Convidado
Convidado


Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 16/11/13, 10:54 pm

Olá Nikou, não resultou.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Shek em 17/11/13, 12:01 pm

Bom dia!

Este problema não acontece em meu navegador: http://i57.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 CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17135
Pontos Ativos : 21397

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Resolvido Re: Organizar o topo da página

Mensagem por Firenando em 17/11/13, 12:21 pm

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...
avatar

Firenando
Membro do Fórum

Masculino
Inscrito dia : 22/10/2011
Mensagens : 1665
Pontos Ativos : 2318

Ver perfil do usuário http://divineartz.forumeiros.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 17/11/13, 02:35 pm

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.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 18/11/13, 08:48 am

Up
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 19/11/13, 08:25 am

Up!
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Shek em 19/11/13, 01:13 pm

Boa tarde!

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

Até mais.


Shek CrowleyAdmineiro - Fórum dos Fóruns

Clicar no botão ou no OBRIGADO não mata ninguém!
avatar

Shek
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 17135
Pontos Ativos : 21397

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 19/11/13, 04:11 pm

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://illiweb.com/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://illiweb.com/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://illiweb.com/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://illiweb.com/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}

avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 20/11/13, 10:32 am

Up!
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 20/11/13, 09:15 pm

UP
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 21/11/13, 11:17 am

Up!
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 22/11/13, 09:59 am

Up.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por POGRAMANDO em 23/11/13, 11:56 pm

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

Até Mais...

POGRAMANDO
Usuário avançado

Masculino
Inscrito dia : 18/09/2013
Mensagens : 342
Pontos Ativos : 579

Ver perfil do usuário http://mundodosforuns.forum-pro.net/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 25/11/13, 08:04 am

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.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 25/11/13, 07:25 pm

Up
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por JScript em 25/11/13, 07:29 pm

@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

avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Resolvido #pun-head {position: fixed;top: 0;left: 0;width: 100%;}

Mensagem por Fernando Rodrigues Bueno em 26/11/13, 01:46 am

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.

avatar

Fernando Rodrigues Bueno
Novo membro

Masculino
Inscrito dia : 26/11/2013
Mensagens : 1
Pontos Ativos : 1

Ver perfil do usuário http://www.forumeiros.com/fergabibueno@hotmail.com

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 26/11/13, 09:32 am

@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.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por JScript em 26/11/13, 10:18 pm

@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 26/11/13, 10:24 pm, editado 1 vez(es) (Razão : Identificado o erro!)
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 26/11/13, 10:31 pm

@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:


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:

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.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Resolvido Re: Organizar o topo da página

Mensagem por JScript em 26/11/13, 10:57 pm

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

Aguarde,

JS
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Resolvido Re: Organizar o topo da página

Mensagem por Legolass em 26/11/13, 11:14 pm

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?
avatar

Legolass
Usuário destaque

Masculino
Inscrito dia : 10/04/2013
Mensagens : 651
Pontos Ativos : 912

Ver perfil do usuário http://www.fanfictionunited.com.br

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 27/11/13, 07:59 am

@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
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/
  • 0

Resolvido Re: Organizar o topo da página

Mensagem por JScript em 27/11/13, 08:51 pm

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
avatar

JScript
Membro do Fórum

Masculino
Inscrito dia : 14/03/2013
Mensagens : 1449
Pontos Ativos : 1900

Ver perfil do usuário http://jscript.forumeiros.com/

Resolvido Re: Organizar o topo da página

Mensagem por Alex Habilidade em 28/11/13, 09:51 pm

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.
avatar

Alex Habilidade
Usuário experiente

Masculino
Inscrito dia : 10/01/2011
Mensagens : 2795
Pontos Ativos : 3774

Ver perfil do usuário http://www.gzhabilidade.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum