Hi Leute, ;Jump
ich hätte mal eine kleine Frage, Ich hab auf einer Seite eine CSS Navigationsleiste eingebaut. Einen Beispielcode hänge ich unten an. Das Ganze sind nebeneinander gesetzte 3D Buttons, die bei einer Bildschirmauflösung vonn 1152x864 gerade so einreihig auf eine Seite passen (bei Verwendung des MS IE). Wenn ich die Seite nun mit Firefox2 öffne, bleibt auf der Seite so ziemlich alles gleich...oder verändert sich unwesentlich. Lediglich die Navigationsleiste wird anders angezeigt. Es verändert sich dabei die Breite der jeweiligen Buttons in soweit, daß der Button dann grade noch so breit ist, wie der Text, der darin steht (Gästebuch...oder sonst was). Das ist jetzt kein Beinbruch, aber wenn es mit nicht all zu großem Aufwand zu beheben wäre, wäre das natürlich klasse. Wie gesagt...ich hänge hier nun mal einen Beispielcode an (meinen kann ich grade nicht anhängen, weil ich nicht zuhause bin), aus dem hervorgeht, wie das ganze gestaltet ist...
Vielleich hat ja jemand ne Idee, wie die Anzeige auch im Firefox gleich bleibt.
<div>
<a href="">Startseite</a>
<a href="">Gästebuch</a>
<a href="">Forum</a>
<a href="">Impressum</a>
</div>
<style type="text/css">
<!--
.navBar {
color: #000000;
width: 150px;
margin: 8px 8px 8px 8px;
padding: 0px 0px 0px 0px;
}
.navBar a {
}
-->
</style>
.navBar a {
border-width: 1px;
border-style: solid;
border-left-color: #FFFFFF;
border-top-color: #FFFFFF;
border-right-color: #666666;
border-bottom-color: #666666;
background-color: #9BCCCA;
}
.navBar a:hover {
border-width: 1px;
border-style: solid;
border-left-color: #666666;
border-top-color: #666666;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
background-color: #7BB9B7;
}
.navBar a {
...
text-align: center;
color:#333333;
text-decoration: none;
padding-top: 2px;
padding-left: 4px;
padding-bottom: 2px;
padding-right: 4px;
...
}
.navBar a:hover {
...
color:#666666;
text-decoration: none;
padding-top: 3px;
padding-left: 5px;
padding-bottom: 1px;
padding-right: 3px;
...
}
Schöne Grüße
ich hätte mal eine kleine Frage, Ich hab auf einer Seite eine CSS Navigationsleiste eingebaut. Einen Beispielcode hänge ich unten an. Das Ganze sind nebeneinander gesetzte 3D Buttons, die bei einer Bildschirmauflösung vonn 1152x864 gerade so einreihig auf eine Seite passen (bei Verwendung des MS IE). Wenn ich die Seite nun mit Firefox2 öffne, bleibt auf der Seite so ziemlich alles gleich...oder verändert sich unwesentlich. Lediglich die Navigationsleiste wird anders angezeigt. Es verändert sich dabei die Breite der jeweiligen Buttons in soweit, daß der Button dann grade noch so breit ist, wie der Text, der darin steht (Gästebuch...oder sonst was). Das ist jetzt kein Beinbruch, aber wenn es mit nicht all zu großem Aufwand zu beheben wäre, wäre das natürlich klasse. Wie gesagt...ich hänge hier nun mal einen Beispielcode an (meinen kann ich grade nicht anhängen, weil ich nicht zuhause bin), aus dem hervorgeht, wie das ganze gestaltet ist...
Vielleich hat ja jemand ne Idee, wie die Anzeige auch im Firefox gleich bleibt.
<div>
<a href="">Startseite</a>
<a href="">Gästebuch</a>
<a href="">Forum</a>
<a href="">Impressum</a>
</div>
<style type="text/css">
<!--
.navBar {
color: #000000;
width: 150px;
margin: 8px 8px 8px 8px;
padding: 0px 0px 0px 0px;
}
.navBar a {
}
-->
</style>
.navBar a {
border-width: 1px;
border-style: solid;
border-left-color: #FFFFFF;
border-top-color: #FFFFFF;
border-right-color: #666666;
border-bottom-color: #666666;
background-color: #9BCCCA;
}
.navBar a:hover {
border-width: 1px;
border-style: solid;
border-left-color: #666666;
border-top-color: #666666;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
background-color: #7BB9B7;
}
.navBar a {
...
text-align: center;
color:#333333;
text-decoration: none;
padding-top: 2px;
padding-left: 4px;
padding-bottom: 2px;
padding-right: 4px;
...
}
.navBar a:hover {
...
color:#666666;
text-decoration: none;
padding-top: 3px;
padding-left: 5px;
padding-bottom: 1px;
padding-right: 3px;
...
}
Schöne Grüße