Aanklikbaar logo boven de header

Status
Niet open voor verdere reacties.

NL1994

Gebruiker
Lid geworden
30 sep 2010
Berichten
25
Hallo,

Ik heb in mijn header een afbeelding als background image ingesteld met css.
Nu wil ik graag boven op de header afbeelding een transparant logo plaatsen met de link naar #.
Ben nu al een tijdje bezig, maar ik krijg het niet voor elkaar.
Kan iemand mij vertellen wat ik moet doen in de html/css bestanden om dit voor elkaar te krijgen?

Alvast bedankt!
 
<div id="Uw website">
<div id="full-width-header">
<a href="DE LINK"><img src="transparent.gif" id="home-link" alt="Navigeer naar de Homepage" /></a>
<div id="header-content">HIER UW TEXT</div>
 
#full-width-header {
position: relative; /* necassary to
absolute-position the child-element
#home-link relative to the header */
background: url(header-logo.jpg);
width: 800px;
height: 172px;
}
#home-link {
position: absolute;
width: 200px; /* breedte */
height: 172px; /* hoogte */
top: 0; left: 0; /* linksboven */
border: 0;
float: left;
}
#header-content {
position: relative;
float: right;
width: 400px;
height: 172px;
vertical-align: bottom;
text-align: right;
}
 
Bedankt voor de reactie Wolf!
Het werkt zo goed als op een ding na:
Het logo is tranparant alleen gaat het ook door de header afbeelding heen.
Het logo komt wel goed tranparant op de header te staan als ik het volgende uit mijn css bestand haal:
*{
margin:0;
padding:0;
background-color:#9ed5fe;
}
Maar als ik dit er uit sloop, dan is mijn achtergrond weer helemaal wit van de pagina.
Hoe kan ik dit oplossen?
 
Dat zou ik dan weer niet weten. Bij mij werkt ie pirma namelijk. Ik hoop dat iemand anders u verder kan helpen
 
Hoi NL1994,
Heb je ergens een testpagina online staan, zodat we er eens naar kunnen kijken?
Het is nu een beetje droogzwemmen. Graag een linkje!

Met vriendelijke groet,
CSShunter
 
Hoi,

Bedankt voor de reacties.
Ik heb het probleem inmiddels weten op te lossen.
In plaats van dit:
*{
margin:0;
padding:0;
background-color:#9ed5fe;
}
Heb ik het background-color:#9ed5fe; eruit gesloopt en de body een background color gegeven. toen deed hij het eindelijk goed!:D
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan