• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

probleme mit dem dropdown menu

Status
Für weitere Antworten geschlossen.
O

omega

Neues Mitglied
hallo leute. ich hab mal ne frage. ich baue gerade eine webseite die ich mit einem dropdown menu versehen habe. die webseite war anfangs total verzogen bis ich das doctype entfernt habe. dann sah die seite gut aus. problem ist jetzt aber das ich nicht mehr die schriftgroesse im dropdown menu veraendern kann.


biite helft mir. die seite ist fuern chef

das ist meine seite


<html>
<head>
<SCRIPT type=text/javascript><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls.onmouseover=function() {
this.className+=" over";
}
sfEls.onmouseout=function() {
this.className=this.className.replace(new RegExp(" over\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></SCRIPT>
<STYLE type=text/css>BODY {
FONT: 2px Arial
}
UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
UL LI {
FLOAT: left; WIDTH: 120px; POSITION: relative
}
LI UL {
DISPLAY: none; LEFT: 0px; POSITION: absolute; TOP: auto
}
LI UL UL {
DISPLAY: none; LEFT: 100%; POSITION: absolute; TOP: -0.1em
}
UL LI A {
BORDER-RIGHT: #EAEAEA 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #EAEAEA 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #EAEAEA; PADDING-BOTTOM: 5px; BORDER-LEFT: #EAEAEA 1px solid; COLOR: #626262; PADDING-TOP: 5px; BORDER-BOTTOM: #EAEAEA 1px solid; TEXT-DECORATION: none
}
* HTML UL LI A {
HEIGHT: 1%
}
LI:hover A {
COLOR: #FF6B1B; BACKGROUND-COLOR: #EAEAEA
}
LI.over A {
COLOR: #FF6B1B; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI:hover A {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI.over A {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI:hover LI:hover A {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI.over LI.over A {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI A:hover {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI A:hover {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI:hover LI:hover A:hover {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI LI A:hover {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI:hover LI:hover LI:hover A:hover {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI.over LI.over LI.over A:hover {
COLOR: #404040; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI A {
COLOR: #777; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI A {
COLOR: #777; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI:hover LI A {
COLOR: #777; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI.over LI A {
COLOR: #777; BACKGROUND-COLOR: #EAEAEA
}
LI:hover LI:hover LI:hover LI A {
COLOR: #777; BACKGROUND-COLOR: #EAEAEA
}
LI.over LI.over LI.over LI A {
COLOR: #777; BACKGROUND-COLOR: #EAEAEA
}
LI UL LI A {
PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px
}
UL LI:hover UL UL {
DISPLAY: none
}
UL LI:hover UL UL UL {
DISPLAY: none
}
UL LI.over UL UL {
DISPLAY: none
}
UL LI.over UL UL UL {
DISPLAY: none
}
UL LI:hover UL {
DISPLAY: block
}
UL LI LI:hover UL {
DISPLAY: block
}
UL LI LI LI:hover UL {
DISPLAY: block
}
UL LI.over UL {
DISPLAY: block
}
UL LI LI.over UL {
DISPLAY: block
}
UL LI LI LI.over UL {
DISPLAY: block
}
</STYLE>


</head>
<body topmargin=0 bottommargin=0>
<div align="center">
<table border="0" width="826" height="100%" cellpadding=0 cellspacing=0>
<tr>
<td height="121" width="826" colspan="2">
<img border="0" src="Images/Banner.png" width="826" height="121"></td>
</tr>
<tr>
<td height="34" width="109">
<img border="0" src="../modus7/Buttons/Home.png" width="109" height="34"></td>
<td height="31" width="717"><UL id=nav>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Home</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Home</A> </LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">About</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">About</A>
<UL>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">History</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">History</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Team</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Team</A> </LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Offices</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Offices</A>
</LI></UL></LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Services</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Services</A>
<UL>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Web">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Web Design</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Internet">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Internet
Marketing</A> </LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">testing">http://www.pmob.co.uk/temp/drop-down-multi.htm#">testing
&gt;</A>
<UL>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 1</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 2</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 3</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">testing">http://www.pmob.co.uk/temp/drop-down-multi.htm#">testing
&gt;</A>
<UL>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 1</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 2</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 3</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 4</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 5</A>
</LI></UL></LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 4</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">test">http://www.pmob.co.uk/temp/drop-down-multi.htm#">test 5</A>
</LI></UL></LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Hosting</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Hosting</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Domain">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Domain
Names</A> </LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Broadband</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Broadband</A>
</LI></UL></LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Contact">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Contact Us</A>
<UL>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">United">http://www.pmob.co.uk/temp/drop-down-multi.htm#">United
Kingdom</A> </LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">France</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">France</A>
</LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">USA</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">USA</A> </LI>
<LI><A href="<A href="http://www.pmob.co.uk/temp/drop-down-multi.htm#">Australia</A">http://www.pmob.co.uk/temp/drop-down-multi.htm#">Australia</A>
</LI></UL></LI></UL></td>
</tr>
<tr>
<td height="100%" width="826" colspan="2">
<iframe scrolling=no width=100% height=100% name=1 id=1 frameborder=0 src="1.htm"></iframe></td>
</tr>
<tr>
<td height="32" width="826" colspan="2" background=Images/hintergrund.png>
<p align="center">
<img border="0" src="../modus7/Images/Telfax.png" width="602" height="32"></td>
</tr>
<tr>
<td height="14" width="826" colspan="2" bgcolor=#006600>
<p align="center"><font size="1" color="#FFFFFF">(c) m.o.d.u.s
computer consulting All Rights Reserved</font></td>
</tr>
</table>
</div>
</body>
</html>
 
Doctype entfernen, damit die Seite so aussieht wie du willst, ist keine Lösung, Doctype ist Pflicht, damit die Brwoser wissen, wie sie mit dem Inhalt umzugehen haben.

Ein Link zur Seite sagt mehr, als der Quellcode hier.

Was aber beim überfliegen schon auffällt sind lauter veraltete Attribute, Tabellenlayout und iframes.
Code: 
<A href="<A href="http
Sowas ist auch nicht erlaubt.

Erster Schritt sollte es sein, deine Seite zu validieren, erst dann macht es sinn, sich um das Layout zu kümmern.

The W3C Markup Validation Service
 
Das werde ich mir nicht weiter anschauen, Warum?
  1. Du verwendest alte Elemente <font size ...>.
  2. Dein CSS ist fast durchgehend groß, dann mal wieder klein, warum?
  3. Du verwendest ein Tabellen-Design.
  4. Der Code enthält einfach zu viele Fehler.
Mein Tipp: Beginne von vorne...

EDIT: Thor war schneller :)
 
tja liebe leute ich rennen eben nicht jeden trend hinter her wie ihr rudeltiere. ich habe so vor ein paar jahren programmieren gelernt und ich behalte meinen still bei. warum. naja ist doch klar weil die broserkopatibilitaet auch weiterhin bei meinem stil gewaehrleistet ist.
und bitte beantwortet mir jetzt meine frage. wie kann ich die scfrift im dropdown menu kleiner machen ohne auf

<STYLE type=text/css>BODY {
FONT: 2px Arial

zurueckgreifen zu muessen.

und wieso brauche ich ein doctype. warum ? warum wenn browser ohne das doctype meine seite perfect anzeigen?
 
Das hat nichts mit Trend zu tun, es geht einzig und alleine um sauberes, valides HTML, welches den Inhalt deiner Seite auszeichnet, denn für nichts anderes ist HTML da.

Deins ist nichts von alledem, veraltete Attribute, nicht valide, Tabellen als Layout und somit auch kein wirklicher Inhalt.

Einen Doctype solltest du verwenden, damit der Browser weiß,
  • mit welcher Sprache und welchem Typ von Dokument er es zu tun, also ob HTML, XHTML oder XML,
  • welche Befehle, Attribute und Einschränkungen für die entsprechende Sprache gelten,
  • was der Browser anzeigen soll,
  • wie er CSS darstellen soll, bzw. wie er sich bei der Anzeige von CSS formatierten Dokumenten verhalten soll,
Ich sehe auch kein Drop-Down-Menu, nur eine Unmenge an Listen und viel zu viel CSS.

Eine Drop-Down-Liste brauchst du dir nicht selber schreiben, dafür gibt es <select>

Code: 
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>
Zu deiner Frage, keine Ahnung, zuviel unsauberer Code, als dass man eine verlässliche Aussage treffen könnte.
 
omega schrieb:
tja liebe leute ich rennen eben nicht jeden trend hinter her wie ihr rudeltiere. ich habe so vor ein paar jahren programmieren gelernt und ich behalte meinen still bei. warum. naja ist doch klar weil die broserkopatibilitaet auch weiterhin bei meinem stil gewaehrleistet ist.
Zum Vergrößern anklicken....
Das hat nichts mit "Trend" zu tun, sondern einfach mit Respekt und Verantwortung.
Wenn Du Programmieren gelernt hast - schön und gut, das brauchst Du für Webseiten nicht, denn weder HTML noch CSS sind Programmiersprachen. Wenn Du HTML als so eine bezeichnest, dann hast Du etwas nicht verstanden - prinzipiell kein Ding, aber dann darf man nicht rumposaunen, dass die eigene Vorgehensweise richtig oder gut ist, wenn man keine Ahnung hat.
Und die Kompatibilität ist durch diese Vorgehensweise tatsächlich nicht gewährleistet. Allein das Wort "Browserkompatibilität" ist schon irreführend, weil man vermutet, es gäbe nur Browser im WWW. Richtig müsste es "Client" heißen, denn es gibt einige Clients, die nicht Browser sind, die nichts am Bildschirm darstellen, die auf valides HTML angewiesen sind und mit dem alten, schlechten Code nicht klarkommen. Dazu zählen auch Vorlesebrowser, aber insbesondere - und für alle wichtig - Suchmaschinen.

Nochmal, es ist kein Ding, sich nicht auszukennen. Das ganze Thema ist umfassender, als es in den Medien dargestellt wird. Und es braucht seine Zeit, das alles zu verstehen und zu lernen. Aber es geht halt nicht an, dass man schlechte Arbeit abliefert und damit angibt, dass das die ultimative Lösung ist und Kompatibilität erzeugt.

Und zu Deiner Frage: Schriftgröße legt man mit font-size in CSS fest.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben