Hallo zusammen
ich habe ein folgendes Problem
undzwar bin ich gerade bei eine seite für die jugendarbeit zu machen und hab folgende divs in der anordnung
<div id="root">
<div id="banner"></div>
<div id="menue"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
der Div id is statisch 800px breit (wurde über width: 800px im Stylesheet definiert) und wird durch die Optionen postion:absolute; left: 50%; margin-left: -400px; mittig gesetzt.
Nun habe ich ein Laymermenu mit GMENUE gemacht.
Jedoch hab ich probleme die Layer richtig und den jeweiligen Punkten auszurichten. zwar schaff ich es über die xPosOffset richtig auszurichten, aber auch nur solange sich die größe des brosers nicht verändert.
meine frage ist nun ob es auch mit typoskript oder sonst irgendwie eine möglichkeit dass die Layer immer und dem jeweiligen punkt sind egal wie groß das browserfenster ist
hier mal noch zur anschauen der Link zur seite
http://blub.rz.uni-ulm.de/~typo3/cms1/
schon mal danke für eure Hilfe
Liebe Grüße
der Jens
Hallo ottmann,
Hier ein paar gut gemeinte Tipps von mir:
1.) Verwende für die Zentrierung deiner Seite besser volgenden Code, dadurch verschiebt sich der Inhalt deiner Seite auch bei einer Fensterbreite unter 800px der Inhalt nicht nach links.
#root {
margin: auto;
margin-top: 0;
padding: 0;
width: 800px;
}
2.) Wieso verwendest du ein GMENU? Soweit ich erkennen konnte ist deine Menüschriftart Arial - also lohnt sich ein GMENU eigentlich nicht. Du hättest damit eigentlich nur Nachteile: Suchmaschinen tun sich schwerer deine Seite zu indizieren, die Ladezeiten sind länger und barierrefrei ist das schon gleich dreimal nicht.
Mit ein wenig CSS-Formatierung und einen Hauch JavaScript kommst du auf ein optisch gleichwertiges und technisch besseres Ergebnis. Außerdem wäre dann das Problem mit der Positionierung hinfällig.
Unter http://www.mortox.de/typo3-tipps/typoscript-sammlung/dropdown-menue.html hab ich vor kurzem ein kleines Tutorial zu genau dem Thema Dropdown Menü erstellt - vielleicht hilfts dir ja weiter.
3.) Wenn du dein altes Menü beibehalten willst, musst du die submenue-divs mit in das #menue-div packen und den linken margin Überschreiben, weil das Menü sonst wahrscheinlich immer links klebt. Also in etwa so:
#menue div {
left:auto !important;
}
Ich hoffe ich konnte weiterhelfen.
Hey mortoX,
erst mal vielen Danke für deine Hilfe
zu 1)
danke für den Tip
Klappt einwandfrei!!
zu 2)
ich werde mich nachher gleich mal des Tutorial anschauen und mit Hilfe von ihm versuchen des Menue zu erstellen.
zu 3)
ok werd ich machen ;-)
Schönen Tag und Liebe Grüße
der Jens
hey also ich hab es mal eingebaut
des menü klappt ohne probleme im IE und Firefox
außer das es im IE um ein kleines Stück nach rechts verschoben wird.
http://blub.rz.uni-ulm.de/~typo3/cms1/
hier kann man es begutachten.
Gibt es da vllt auch noch einen Trick was wegzubekommen?
wäre super
ich hab folgendes Sytelsheet eingebunden:
body{margin:auto;}
#root{margin: auto;
margin-top: 0;
padding: 0;
width: 800px;}
#content{}
#footer{background-color: #a7248c;
width:800px;
text-align:center;
color: White;
font-weight:normal;
font-size:12px;
padding-top:14px;
padding-bottom:14px;}
ul.menu {list-style-type:none;
padding-left: 0;
margin-top: 0;}
ul.menu a {display: block;
padding: 3px 10px 3px 10px;
font-weight:normal;
color: #a7248c;
font-weight:bold;
text-decoration:none;}
ul.menu ul a {padding: 0 10px;
color: #FFFFFF;
font-weight:normal;}
ul.menu li {padding:0;
margin:0;
background-image: none;
background-color: #FFFFFF;
color: #a7248c;
font-weight:bold;
float:left;}
ul.menu ul {margin-left:0;
padding: 0 0 5px 0;
position: absolute;
background-color: #a7248c;
border:0px solid #a7248c;
color: #FFFFFF;
display:none;
min-width:180px;
list-style-type:none;}
*html ul.menu ul {width:180px;}
ul.menu ul.hover, ul.menu li.hover ul, ul.menu li:hover ul {display:block;}
ul.menu ul li {float:none;
background-color: transparent;}
hab auch noch probleme mit der Zentrierung des Root Divs
der div wird schon mittig im IE und Firefox gesetzt solang ich die html Datei auf meinem Webserver hab.
Wenn ich jedoch die HTML Datei das Designvorlage in TYPO3 einbind klappt es im Firefox weiterhin ohne Probleme, jedoch nicht mehr im IE.
an was kann das denn liegen?
Bin leider mit meinem Latein am ende #angry#
schon mal danke für eure Hilfe
Liebe Grüße
der Jens
Also, das Problem mit der Zentrierung ist einfach, erweiter mal dein Stylesheet so (alles andere so lassen):
body{
margin:auto;
text-align: center;
}
#root{
position: relative;
margin: auto;
margin-top: 0;
padding: 0;
width: 800px;
text-align: left;
}
Müsste funktionieren und ist komisch, dass es das lokal überhaupt getan hat.
durch das position: relative; könnte sich auch das Problem mit dem unterschiedlichen Abstand lösen, ansonsten müsstest du deinen Doctype mal noch umstellen.
Grüße
Christian
mh was soll man sagen, ich glaub perfekt trifft es sehr gut 8-)
klappt wunderbar in IE und Firefox
Herzlichen Danke
Liebe Grüße
der Jens
so hab es jetzt mal noch mit x Möglichkeiten versucht dass das Menue auch im IE am rand vom root div is so wie im Firefox
jedoch ohne erfolg #angry# 😢
hat vllt jemand von euch noch nen tip?
http://blub.rz.uni-ulm.de/~typo3/cms1/
hier könnt ihr euch die Problem stellung noch anschauen
danke und lg der Jens[/url]
Änder im CSS ul.menu mal so:
ul.menu {
list-style-type:none;
padding:0;
margin:0;
}
Grüße
Christian
ok nun bin ich happy^^
geht auch
ganz großes Dankeschön für eure Hilfe
Liebe Grüße
der Jens
Hi,
ich habe genau das gleiche Problem wie meine Vorposter. Leider kann ich dem ganzen nicht so wirklich folgen.
Mein TS-Code sieht so aus:
NAVIOBEN = HMENU
NAVIOBEN {
special = directory
# Edit mittwald
special.value = 2
entryLevel = 1
1 = GMENU_LAYERS
1.layerStyle = position:absolute;left:0px;top:0px;width:10px;VISIBILITY:hidden;
1.xPosOffset = 0
1.topOffset = 0
1.lockPosition = x
1.expAll = 1
1.displayActiveOnLoad = 0
1.NO = 1
1.NO {
backColor = #fff1c4
XY = [10.w]+36,25
5 = BOX
5.dimensions = 2,13,5,1
5.color = #99CC99
7 = BOX
7.dimensions = 4,11,1,5
7.color = #99CC99
10 = TEXT
10.text.field = title
#10.text.case = normal
10.offset = 14,18
10.fontFile = fileadmin/fonts/verdana.ttf
10.fontSize = 10
10.fontColor = #5f3a31
}
RO < .NO
RO {
5.color = #ffffff
7.color = #ffffff
10.fontColor = #ffffff
}
RO = 1
ACT < .NO
ACT {
#gelber Rahmen um Vorzeichen
1 = BOX
1.dimensions = 0,11,9,9
1.color = #fedc92
3 = BOX
3.dimensions = 1,12,7,7
3.color = #fedc92
#kein |
7 >
}
ACT = 1
2 = GMENU
2.wrap = |<br />
2 {
NO {
backColor = #fedc92
XY = 120,19
#linker und unterer Strich
5 = BOX
5.dimensions = 0,0,1,24
5.color = #fedc92
7 = BOX
7.dimensions = 0,18,110,1
7.color = #fedc92
10 = TEXT
10.fontFile = fileadmin/fonts/verdana.ttf
10.fontSize = 10
10.text.field = title
#10.text.case = lower
10.offset = 12,12
10.fontColor = #5f3a31
}
RO < .NO
RO.10.fontColor = #ffffff
RO = 1
ACT < .NO
ACT.10.fontColor = #ffffff
ACT = 1
}
}
Wie mache ich das Menu relativ zu parent?
Dann hätte ich noch 2 weitere Fragen:
1. Ist es möglich im HMENU die Abstände zwischen den einzelnen Menupunkte zu vergrößern?
2. Kann man mit GMENU noch eine dritte Menu-Ebene einfügen?
Würde mich über eure Hilfe freuen.
Liebe Grüße Johannes