Horizontales Menü gestalten
Christian
- css
0 Ingo Turski
hi,
ich hab schon mal nen thread über s ein hema gemacht, ist aber zu wenig rausekommen weil ich auch zu wenig angaben gemacht habe.
Naja, jetz hab ich mich selbst durchgekämpft und habs fast geschafft.
Jetzt nur noch ein Problem geblieben:
ich hab ein so ein kleines Menü in in leite vnBilderegesetzt. und immer wenn ich das Bild vor dem Menü mit einem Link versehe legt sich das ausfahende Menü immer darüber!
wie kann ich das verhindern? Wo hab ich einen Fehler in meine Programmierung gemacht?
Damit ich das überhaupt proggen kann hab ich mir den Linkzu nutze gemacht: http://de.selfhtml.org/css/layouts/navigationsleisten.htm
Und hier noch mein Code, ich hab ihn für die seite www.ptfe.eu.com gebraucht und erst bei "Who we are" zu teen vrwirklicht.
<html>
<style type="text/css">
body {
}
* html div#Rahmen { /* Korrektur fuer IE 5.x */
width: 0em;
w\idth: 0em;
}
div#Rahmen div {
clear: left;
}
ul#Navigation {
margin: 0; padding: 0;
text-align: center;
}
ul#Navigation li {
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin: 0em; padding: 0;
}
* html ul#Navigation li { /* Korrektur fuer den IE 5 und 6 */
margin-bottom: 0em;
}
*:first-child+html ul#Navigation li { /* Korrektur fuer den IE 7 */
margin-bottom: 0em;e
}
ul#Navigation li ul {
margin: 0; padding: 0;
position: absolute;
top: 0em; left: 0em;
display: none; /* Unternavigation ausblenden */
}
* html ul#Navigation li ul { /* Korrektur fuer IE 5.x */
left: 0em;
lef\t: 0em;
}
*:first-child+html ul#Navigation ul { /* Workaround fuer den IE 7 */
background-color:silver; padding-bottom:0em;
}
ul#Navigation li:hover ul {
display: block; /* Unternavigation in modernen Browsern einblenden */
}
ul#Navigation li ul li {
float: none;
display: block;
margin-bottom: 0em;
}
ul#Navigation a, ul#Navigation span {
display: block;
width: 0em; /* Breite den in li enthaltenen Elementen zuweisen */
padding: 0em 0em;
text-decoration: none; font-weight: bold;
}
* html ul#Navigation a, * html ul#Navigation span {
width: 114em; /* Breite nach altem MS-Boxmodell für IE 5.x */
w\idth: 0em; /* korrekte Breite fuer den IE 6 im standardkonformen Modus */
}
ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
}
li a#aktuell { /* aktuelle Rubrik kennzeichnen */
}
ul#Navigation li ul span { /* aktuelle Unterseite kennzeichnen */
</style>
<div align="center">
<head>
<meta http-equiv="Content-Language" content="de-at">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" >
<title>RTS - who we are </title>
</head>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0" bgcolor="666666" align="center" >
<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="800" height="530">
<!-- MSTableType="layout" -->
<div align="center">
<tr>
<td valign="top" height="24">
<!-- MSCellType="ContentBody" -->
<img border="0" src="PSD-28.5_01.gif" width="800" height="24"></td>
</tr>
<tr>
<td valign="top" height="77">
<a href="index.htm">
<img border="0" src="1_02.gif" width="133" height="77"></a><img border="0" src="2_03.gif" width="112" height="77"><img border="0" src="3_04.gif" width="111" height="77"><img border="0" src="4_05.gif" width="111" height="77"><img border="0" src="5_06.gif" width="111" height="77"><img border="0" src="6_07.gif" width="111" height="77"><img border="0" src="7_08.gif" width="111" height="77"></td>
</tr>
<tr> <li>
<td valign="top" height="25" bgcolor=ffffff>
<ul id="Navigation">
<li>
<a href="Who%20we%20are.htm">
<img src="who-we-are-blau_09.gif" width="133" height="25" border="0"></a></li>
<li>
<img border="0" src="AGB_04.gif">
<ul style="position: absolute; left: 0px; top: 25px"></li>
<span>
<a href="PTFE-U1.htm">
<img border="0" src="ausklappbalken01_17.gif" width="112" height="25"></a></span>
<span>
<a href="PTFE-U2.htm">
<img border="0" src="ausklappbalken02_19.gif" width="112" height="25"></a></span>
<span>
<a href="PTFE-U3.htm">
<img border="0" src="ausklappbalken03_20.gif" width="112" height="25"></a></span>
<li>
<a href="PTFE-U4.htm">
<img border="0" src="ausklappbalken04_21.gif" width="112" height="25"></a></li>
</ul></li>
</ul>
<a href="Machinery.htm"><img border="0" src="PSD-28.5_05.gif" width="111" height="25"></a><a href="technical%20service.htm"><img border="0" src="PSD-28.5_06.gif" width="111" height="25"></a><a href="export.htm"><img border="0" src="PSD-28.5_07.gif" width="111" height="25"></a><img border="0" src="PSD-28.5_08.gif" width="111" height="25"><img border="0" src="AGB_09.gif" width="111" height="25"></td>
</li>
</tr>
<tr>
<td valign="top" height="400" width="800" bgcolor="ffffff" >
<!-- MSCellType="ContentBody" -->
<dd>
<p align="center">
<span class="ziel">
<font face="Arial" color="#6666CC">
<br>
</font>
<font face="Century Gothic" color="#6666CC">
Company Pofile</font>
<font face="Arial" size="2" color="#666666">
<br>
<br> RTS s.r.l. is specialized engineer pf PTFE production plants and is an experienced company
<br> disposing of a id knowledge in the processing of technical fluorintated polymers.
<br>
<br> RTS s.r.l. specialized s the ratment andocessing of micro powder, virgin,
<br> compounded, charged and rprocssd PTFE accoding o diffnt prcenes and all degrees.
<br>
<br> So the acquired professionalism has enabled RTS s.r.l. to provide production
<br> systems for more than 500 different kinds of PTFE.
<br>
<br> RTS has realized complete PTFE plants all over the world in a more then 20 years of
<br> experience in engineering, delivering and ready-to-use machines and sites of all sizes.
<br>
<br> RTS srl. is seated in Brescia, in the northern part of Italy, near Milan.
</font></span></dd>
</dd>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="800" height="75">
<!-- MSTableType="layout" -->
<div align="center">
<tr>
<td valign="top" height="50">
<!-- MSCellType="ContentBody" -->
<img border="0" src="Who-we-are_11.gif" width="800" height="50"></td>
</tr>
<tr>
<td valign="top" height="25" width="800">
<img border="0" src="Who-we-are_12.gif" width="338" height="25"><a href="AGB.htm"><img border="0" src="Who-we-are_13.gif" width="56" height="25"></a><img border="0" src="Who-we-are_14.gif" width="21" height="25"><img border="0" src="Who-we-are_15.gif" width="52" height="25"><img border="0" src="Who-we-are_16.gif" width="333" height="25"></td>
</tr>
</table>
</body>
</html>
ich hoffeihr könnt mir helfe!
Mfg Christian
Hi,
Und hier noch mein Code, ich hab ihn für die seite www.ptfe.eu.com gebraucht und erst bei "Who we are" zu teen vrwirklicht.
warum gibst Du nicht einfach die URL http://www.projektmarketing.at/ptfe.eu.com/Who%20we%20are.htm direkt an?
<html>
davor fehlt schon mal der DOCTYPE, so dass die Seite von jedem Browser nach eigenem Ermessen (anders) angezeigt werden kann. Ändere dies und korrigiere diese 63 Fehler.
ul#Navigation li {
list-style: none;
float: left; /* ohne width - nach CSS 2.1 erlaubt */
position: relative;
margin: 0em; padding: 0;
}
* html ul#Navigation li { /* Korrektur fuer den IE 5 und 6 */
margin-bottom: 0em;
}
*:first-child+html ul#Navigation li { /* Korrektur fuer den IE 7 */
margin-bottom: 0em;e
}
Du solltest zumindest ansatzweise verstehen, wozu der CSS-Code da ist, denn die Korrekturen für die IEs (auch im folgenden) sind so sinnlos.
</style>
<div align="center">
<head>
oops... wie wäre es, wenn Du Dich zunächst mal mit den Grundlagen von HTML vertraut machst. Das style-Element gehört in den head und div in den body.
freundliche Grüße
Ingo
hi,
danke ingo für die auskunft aber, ist es zwingend das man doctype angibt?
weil; -welchen doctype soll ich jetzt überhaupt hinschreiben
-ist ein doctype angabe überhaupt zwingend weil jetz hab ich mal mit einem ausprobiert, jedoch wird dann alles nicht mehr so schön angezeigt.
-was ist wenn ich mehrere verschiedene doctypes eingebaut habe?
auserdem, mir geht es hauptsächlich um die frage die ich ganz im ersten thread gestellt habe, und zwar, wie kann ich es verhindern das wenn ich den button der vor dem css programmierten ausklappbaren menüs steht, überdeckt wird wenn ich diesen mit einem hyperlink versehe?
ach ja, dieses fehleranzeigeprogramm, kann es sein das dieses mehr fehler anzeigt als wirklich sind? ich hab nämlich mal durchgeschaut und irgendwie kommen mir ein paar sachn richtig vor obwohl diese als falsch angezeigt werden!
mfg
Christian
Hi,
danke ingo für die auskunft aber, ist es zwingend das man doctype angibt?
Ja. Das verringert Fehldarstellungen bzw. unterschiedliche Interpretationen.
weil; -welchen doctype soll ich jetzt überhaupt hinschreiben
am besten den vom Validator genommenen - das ist das geringste Übel für Dich.
-ist ein doctype angabe überhaupt zwingend weil jetz hab ich mal mit einem ausprobiert, jedoch wird dann alles nicht mehr so schön angezeigt.
Das liegt daran, dass der/die Browser, in denen Du Unterschiede bemerkst, Deine Fehler nun nicht mehr auszubügeln versuchen - das musst Du nun selbst erledigen.
-was ist wenn ich mehrere verschiedene doctypes eingebaut habe?
Du kennst Highlander? ;-)
auserdem, mir geht es hauptsächlich um die frage die ich ganz im ersten thread gestellt habe
behebe die Fehler und wenn das Problem weiterhin besteht, dann lade eine valide Testseite zur Ansicht hoch.
ach ja, dieses fehleranzeigeprogramm, kann es sein das dieses mehr fehler anzeigt als wirklich sind? ich hab nämlich mal durchgeschaut und irgendwie kommen mir ein paar sachn richtig vor obwohl diese als falsch angezeigt werden!
Nein. Ist aber auch kein Wunder, dass Dir manche Fehler richtig vorkommen.
freundliche Grüße
Ingo