ugrás a tartalomhoz

Ismétlődő háttér problémája

manuelc · 2007. Dec. 8. (Szo), 16.01
Helló!


Éppen egy webshopot szeretnék összehozni, de sajnos úgy néz ki, hogy nem boldogulok a fejléccel. Mivel full screen honlapot kell csinálnom adódott egy probléma az oldal tetején elhelyezkedő logós, keresős fejléccel.

A következőképpen próbáltam megoldani a szituációt <----------------->

<: bal fejlécrész (div backgroundként no repeat)
-: ismétlődő fejlécrész (div backgroundként előtérben a keresőbox-al)
>: jobb záró fejlécrész (div backgroundként no repeat)

De sajnos minden elcsúszott akkor is amikor végre sikerült összeilleszteni a közepét és a végét.
Plz segítsetek, adjatok vmi tippet, hogyan tudnám összerakni a fejlécet.

Köszönöm a segítséget!


Részlet az eredeti CSS-ből
_______________________________
body {
margin: 5px;
background-color: #0000;
background-image: url(../styleImages/backgrounds/pageBg.gif);
background-repeat: repeat-x;
background-position: top;
}
#pageSurround {
width: 95%;
margin: 0px auto;
padding: 5px;

}
#topHeader {
text-align: right;
height: 0px;
padding-right: 20px;
padding-top: 0px;
width: 100%;
margin: 0px auto;
/* SKIN VARIABLE IS cAsE SeNsItIvE */
background-image: url(../../../images/pagebg_ism.gif);
background-repeat: repeat-x;
background-position: top left;
}


________________________________________________


Részlet az eredeti HTML-ből:
____________________________
</head>
<div id="topHeader">
<div>{SEARCH_FORM}</div>

</div>
<div>{SITE_DOCS} </span></div>
<div id="pageSurround">
<div>
.
.
.
___________________________


Üdv,
Manuel
_____________________________
‹ CSS-ben formázott horizontális lista IE alatt nem működik rendesen IE div pozícionálás hiba ›
 ■
1

Egy példa

vbence · 2007. Dec. 8. (Szo), 16.25
Legközelebb használd a colorert, ha programkódot postolsz! Így nehezen olvasható. Másrész nem lehet jó, mert csak két kép szerepel benne, még a leírásban hármat említesz.

Egy megoldás, ha egymásba ágyazod őket:

<div id="nagyhatter">
    <div id="eleje">
        <div id="vege">
            <input type="text" id="kereso"/>
        </div>
    </div>
</div>
A css pedig:

#nagyhatter {
    backround: url('ismetlodo-hatter.jpg');
}

#eleje {
    backround: url('eleje.jpg') no-repeat;
}

#vege {
    backround: url('vege.jpg') no-repeat top right;
}

#kereso {
    float: right;
    margin-right: 100px;
}
(A colorer a "right" helyett "rightright"-ot ír ebben a pillanatban, nem tudom miért)
2

explorer hiba

manuelc · 2007. Dec. 10. (H), 13.51
.
3

Helyzet?

vbence · 2007. Dec. 11. (K), 13.36
No? Valami előrelépés?
4

bigthx

manuelc · 2007. Dec. 12. (Sze), 10.24
Köszönöm a segítséget, sikerült összehozni!