[css] IE fout & links hebben verkeerde kleur - Softwareontwikkeling

dinsdag 8 mei 2007 10:35

Acties:

Awesomeness

Topicstarter

ik ben nogal een beginner op het gebied van CSS, ik kan er wel wat van maar toch zitten er wat kleine fouten in: bijv als het menu open in IE6 dan lijkt het niet meer op mijn menu (zoals in firefox ) dan zit alles half onder elkaar. ook zijn de links in het hoofdmenu paars ipv blauw, de kleur die ik ze toch echt gegeven heb.
dit is mijn CSS code

code:

ul.nav,
.nav ul{
    margin: 0;
    padding: 0;
    cursor: default;
    list-style-type: none;
    display: inline;
}

ul.nav{
    position:relative;display:block;height:21px;font-size:11px;

}
ul.nav>li{
    display: table-cell;
    position: relative;
    padding: 2px 6px;
}
ul.nav li>ul{

    display: none;
    position: absolute;
    max-width: 40ex;
    margin-left: -6px;
    margin-top: 2px;
}

ul.nav li:hover>ul{
    display : block;
}

.nav ul li a{
    display: block;
    padding: 2px 10px;
}

ul.nav,
.nav ul,
.nav ul li a{
    background:transparent url(images/bgOFF.gif) repeat-x top left;
border-bottom:1px solid #d9d9d9;
color: #034895;        
    }


ul.nav li:hover,
.nav ul li a:hover{
    
background:transparent url(images/bgON.gif) repeat-x top left;       

    
}

ul.nav li:active,
.nav ul li a:active{
background:transparent url(images/bgON.gif) repeat-x top left;
}

ul.nav,
.nav ul{
background:transparent url(images/bgOFF.gif) repeat-x top left;
    
}

.nav a{
    text-decoration: none;
}

en dit is het HTML gedeelte van het menu:

code:

<ul class="nav">
<li><a href=""><strong>Home</a>

</li>
<li><a href="index.html"><strong>MENU1</a>
    <ul>
    <li><a href="">menu2</li>
    <li><a href="">...</a></li>
    <li><a href="">...</a></li>
    <li><a href="">...</a></li>
    </ul>
</li>
</ul>

ik hoop dat iemand mij kan helpen..

When I get sad i stop being sad and be awesome instead

dinsdag 8 mei 2007 16:12

Acties:

goMY

De volgende site gebruikt een stukje Javascript om het in Internet Explorer te laten werken. Lijkt wel wat op je eigen code. http://www.alistapart.com/articles/horizdropdowns

De kleur van de links is misschien omdat je niet a:visited niet hebt ingesteld, maar dat weet ik niet zeker.

Niet echt netjes die oplossing met Javascript eigenlijk, misschien heeft iemand anders een nettere oplossing!

[ Voor 32% gewijzigd door goMY op 08-05-2007 16:15 ]

dinsdag 8 mei 2007 17:08

Acties:

Kwastie

Awesomeness

Topicstarter

ik heb het geporbeerd werkt niet, helaas

When I get sad i stop being sad and be awesome instead

dinsdag 8 mei 2007 17:10

Acties:

TeeDee

CQB 241

Heb je niks online staan? Zo wordt het een beetje lastig testen

Heart..pumps blood.Has nothing to do with emotion! Bored

dinsdag 8 mei 2007 17:20

Acties:

Kwastie

Awesomeness

Topicstarter

jawel heb ik wel online staan www.console-nation.nl/demo2/
edit:
fout van kleur heb ik inmiddels gevonden

het komt door de link die ik heb gemaakt in het menu(<a herf> maar als ik dat NIET toevoeg (dan is de link niet klikbaar en is het dus geen menu)

[ Voor 66% gewijzigd door Kwastie op 08-05-2007 17:24 ]

When I get sad i stop being sad and be awesome instead

dinsdag 8 mei 2007 17:35

Acties:

Kwastie

Awesomeness

Topicstarter

ik had eerst een andere script, deze werkte perfect maarja.. er zat geen sub-menu ding bij.. dus heb ik een andere gemaakt. de oude was ook in een andere stijl geschreven.(van internet gehaald)
mischien kan iemand deze dan porten of zodat ik een submenu heb..(stuk 2 wel zelf gemaakt, waar het probleem in zit)

dit stuk code werk WEL goed

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
<html>
<head>
<title>test</title>
<style type="text/css">
#styleone{position:relative;display:block;height:21px;font-size:11px;
font-weight:bold;background:transparent url(images/bgOFF.gif) repeat-x top left;
font-family:Arial,Verdana,Helvitica,sans-serif;border-bottom:1px solid #d9d9d9;}


#styleone ul{margin:0;padding:0;list-style-type:none;width:auto;}

#styleone ul li{display:block;float:left;0 1px 0 0}


#styleone ul li a{display:block;float:left;color:#034895;text-decoration:none;
padding:3px 20px 0 20px;height:18px;}


#styleone ul li a:hover,#styleone ul li a.current{color:#034895;
background:transparent url(images/bgON.gif) repeat-x top left;
</style>
<div id="styleone">

<ul>

<li><a href="" title="">Home</a></li>
<li><a href="" title="">Fotoalbums</a></li>
<li><a href="" title="">Fotobeheer</a></li>

</ul>
</div>
<body style="background-color: #F8F8FF">
</body>
</html>

When I get sad i stop being sad and be awesome instead

dinsdag 8 mei 2007 20:05

Acties:

dB90

a:visited color veranderen in je css? Of bedoel je dat niet?

Webberry Webdevelopment

dinsdag 8 mei 2007 20:23

Acties:

Kwastie

Awesomeness

Topicstarter

het is nu gefixed heb wat lopen kloten

(wat precies weet ik niet maarja)

When I get sad i stop being sad and be awesome instead

dinsdag 8 mei 2007 20:33

Acties:

TeeDee

CQB 241

Laat dan ook even zien (in het kader van de search e.d.) hoe en wat je opgelost hebt.
Wel zo netjes.

Heart..pumps blood.Has nothing to do with emotion! Bored

dinsdag 8 mei 2007 20:42

Acties:

BtM909

Watch out Guys...

Zet voortaan je code tussen [code=html][/] en [code=css][/] tags, zodat het iets beter kleurt.

Overigens is GoT geen afhaalchinees voor scripts, dus we verwachten de volgende keer wel iets meer zelfinzet, ok?

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

woensdag 9 mei 2007 12:45

Acties:

Kwastie

Awesomeness

Topicstarter

ok ik vervolg zet ik ze wel in html
ik heb het inmiddels ZELF gefixed, alleen zit er nu een andere raare fout in.. in IE zit het submenu naast elkaar en bij firefox onderelkaar, ik wil het naast elkaar zoals je dat ziet in IE.. & ik wil graag dat het menu doorloopt zoals ik eerst had maar waarschijnlijk komt dat door de IE fix dat dat niet werkt :((www.console-nation.nl/demo/)

www.console-nation.nl/demo2/ hier kun je hem zien in actie..

Cascading Stylesheet:

<style>


#mainMenu {
    width:100%;
        position:relative;
        display:block;
        height:23px;
        font-size:13px;
        font-weight:bold;
    margin-top:0px;
    
    /*margin-right: auto !important;*/
    clear:none !important;
}
        

#mainMenu ul {
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px !important;
    position:relative;
    z-index:999 !important;
    clear:left;
    list-style: none;
    width:100%;
    margin-left:auto !important;
    margin-right:auto !important;
    padding: 0;

}

#mainMenu li {
    float: left;
    position: relative;
    text-align: left;
    width:auto;
    cursor: default;
    
}

#mainMenu #nav li a:hover {
    background:transparent url(images/bgON.gif) repeat-x top left;
    
    text-decoration:none;
    z-index:999;

    }

#mainMenu li ul {
    display: none;
    position: absolute;
    float:left;
    

}

#mainMenu li>ul {
    top: auto;
    left: auto;
}

#mainMenu li li {
    display: block !important;
    background:transparent url(images/bgON.gif) repeat-x top left;
    width:auto !important;
    margin-bottom: 5px;
    border:none;
    font-weight: 200;
}


#mainMenu #nav li li a {
    display: block !important;
    cursor:pointer;
    background:transparent url(images/bgOFF.gif) repeat-x top left;
    color:#034895;
    padding:-5px 7px;
    text-decoration:none;
    letter-spacing:0px;
    font-weight:bold;
}

#mainMenu #nav li li a:hover {
    padding: 5px 7px;
    border-width: 1px 1px;  
    background:transparent url(images/bgON.gif) repeat-x top left;
        color:#034895;
    z-index:999;

}


#mainMenu li:hover ul, #mainMenu li.over ul {
    display:block;
    z-index:999;
}


#mainMenu ul a, #mainMenu ul a:visited {
    display:block;
    cursor:pointer;
    background:transparent url(images/bgOFF.gif) repeat-x top left;
    
    padding:5px 7px;
    color:#034895;
    text-decoration:none;
    letter-spacing:0px;
    }


</style>

[ Voor 3% gewijzigd door Kwastie op 09-05-2007 12:50 ]

When I get sad i stop being sad and be awesome instead

woensdag 9 mei 2007 17:16

Acties:

dB90

Even tussendoor, heb je wel eens geprobeert het tweede submenu item aan te klikken? Ik snap dat het nog een demo is maar daar zou ik nog even naar kijken...

Webberry Webdevelopment

Pagina: 1

Reageer