← HTML + CSS

Header em css

Lida 1071 vezes

Offline

Souza 
Elite
Mensagens 1816 Gostos 1
Troféus totais: 28
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

Viva, estou a tentar mudar o header da minha loja online, queria que por cima da barra de pesquisa aparecesse uma imagem.
 

html:
/head>

<body onload="initialiseMenu();{EXTRA_EVENTS}">
   <div id="topHeader">
     <div>{SEARCH_FORM}</div>
   
   </div>
<h2 class="pos_right">This heading is moved right to its normal position</h2>
<div>{SITE_DOCS}</div>
<div id="pageSurround">
  <div>


CSS:
}

h2.pos_left
{
position:relative;
left:-400px
}
h2.pos_right
{
position:relative;
left:400px

}

#topHeader {
   text-align: right;
   height: 46px;
   padding-right: 0px;
   padding-top: 55px;   
   width: 95%;   
   margin: 0px auto;
   /* SKIN VARIABLE IS cAsE SeNsItIvE */
   background-image: url(../../../images/getLogo.php?skin=KitaBlue);
   background-repeat: no-repeat;
   background-position: top left;
}
.boxTitleLeft, .boxTitleRight {
   font-family: "Lucida Sans", "Lucida Sans Unicode", Verdana;
   font-size: 13px;
   font-weight: bold;
   color: #FFFFFF;
   background-color: #326e96;
   height: 15px;
   border-top: 1px solid #E1E1E1;
   border-left: 1px solid #E1E1E1;
   border-right: 1px solid #E1E1E1;
   padding: 5px;
}
.boxContentLeft, .boxContentRight {
   border: 1px solid #E1E1E1;
   background-color:#FFFFFF;
   padding-left: 5px;
   padding-right: 5px;
   margin-bottom: 10px;
   padding-top: 3px;
   padding-bottom: 5px;
}


.boxCategories {
   border: 1px solid #E1E1E1;
   background-color: #FFFFFF;
   padding-left: 5px;
   padding-right: 5px;
   margin-bottom: 10px;
   padding-top: 3px;
   padding-bottom: 10px;
}
.colLeft {
   position: relative;
   z-index:5;
   left: 0px;
   width: 160px;
   float: left;
}
.colMid {
   position: relative;
   width: 100%;
   float: left;
}
.colRight {
   position: relative;
   width: 160px;
   float: right;
}
.boxContent {
   border: 1px solid #E1E1E1;
   background-color: #FFFFFF;
   padding: 10px;
   color: #333333;
   margin-bottom: 10px;
   margin-top: 0px;
   position: inherit;
}

Tentei colocar uma nova div com o nome de topheader2 mas o problema é que empurra sempre a outra div para baixo, ou para cima se puser a nova por baixo. Como faço para que apareça a imagem sem desconfigurar a #TopHeader?

Agradeço uma ajudinha pessoal ;)

Abraços.
Offline

Souza 
Elite
Mensagens 1816 Gostos 1
Troféus totais: 28
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

Tudo resolvido.
Podem fechar.