Suche im Forum:
Suchen


Autor Nachricht
Beitrag15.08.2007 um 10:41 (UTC)    
Titel: positionierung in IE &FF gleich?

guten tag erstmal

ich hab mein Coolmenü eben positioniert
aber mir ist aufgefallen dass die Positionierung im inet und firefox nicht gleich ist. (left ist in ordnung aber Top nicht? also von oben Confused )

in FF ist das menü unter dem header aber im Internet explorer ist sie schon im Header drin?

wie kann ich man es verhindern... Confused

meine HP www.zaza12.de.tl

bie www.coolplace.de.tl

ist die Position des menüs bei beiden browser gleich

mfG
Beitrag15.08.2007 um 10:56 (UTC)    
Titel:

war bei mir auch so weil beim firefox ist des coolmenü weiter unten weil da oben mehr abstannt ist ka warum
______________

CSS-Designs und füge deins zur Sammlung hinzu! Coole Bannervorlage
Beitrag15.08.2007 um 11:01 (UTC)    
Titel:

ich hab auch bei lucarios-site.de.tl ein Bild positioniert (das kicklee bild links.) und im IE sieht das echt schlimm aus und deswegen wäre es meiner meinung nach aber schlauer das so zu positionieren das es bei FF besser aussieht weil die meisten haben FF und nicht IE
______________
Ich suche einen Grafiker für meine Page!

Beitrag15.08.2007 um 11:11 (UTC)    
Titel:

lucarios-site hat Folgendes geschrieben:
ich hab auch bei lucarios-site.de.tl ein Bild positioniert (das kicklee bild links.) und im IE sieht das echt schlimm aus und deswegen wäre es meiner meinung nach aber schlauer das so zu positionieren das es bei FF besser aussieht weil die meisten haben FF und nicht IE


Es ist auf jeden Fall ratsam, sich für eine Browservariante zu entscheiden und die Besucher ggf. darauf hinzuweisen, mit welchem Browser die Seite erstellt ist.
Zum Beispiel: "Diese Seite ist für Firefox 2.o optimiert" oder sowas ähnliches.
IE und FF werden immer verschiedene Darstellungsvarianten haben und meines Wissens nach gibt es keinen "Mittelweg" oder etwas, was beide Browser in der Darstellung gleichsetzt.
______________
[img:545b48087d]http://img.webme.com/pic/f/familyworld/famsigbanner.gif[/img:545b48087d]
Beitrag15.08.2007 um 11:15 (UTC)    
Titel:

keine Ahnung Shocked

ich wollte mein menü genau auf content_top positionieren aber leider funktioniert es nicht...

vllt gibt s eine code womit man es mahcen kann

zB ....{position: =td.edit_content_top;}

oder ähnliches Confused

sonst lohn es sich garnicht eine navileiste oben zu erstellen
Beitrag15.08.2007 um 12:01 (UTC)    
Titel:

Dafür gibt es einen einfachen Trick:

Schreibst du eine Klasse so:
Zitat:

coolmenue {Werte;}


So wird der Code von beiden Browsern gelesen.
Benutzt du folgenden CodeSchnipsel, dann kann nur der IE die Klasse gelesen.
Zitat:
* html coolmenue {Werte;}

Durch * html kann nur der IE die Klasse lesen.

Also ohne den Codeschnipsel die Werte für FF optimieren, mit CodeSchnipsel für IE optimieren.

Wichtig: Wichtig ist erst die Klasse ohne Schnipsel zu schreiben und dann mit, dasist wichtig, weil die Codes von oben nach unten gelesen werden, also so:
Zitat:

coolmenue {Werte;}

* html coolmenue {Werte;}

______________
[color=red:ac077f9a56]Gruß domi89[/color:ac077f9a56]

Beitrag15.08.2007 um 20:43 (UTC)    
Titel:

Das ist jetzt meine Code

und wo soll ich die Klaasen einfügen Confused ?


Code:
<div align="center">

<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}


div.menu
{
position: absolute;
z-index: 1;top: 195px;
left: 200px;}
}

.menu li
{
width: 145px;
float: left;
}

.menu a
{
background-color: #00fff0;
background-image: url();
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 1px;
display: block;
height: 25px;
color: #000000;
border: 3px double #fff;
}

.menu a:hover
{
background-color:;
background-image: url();
color: #ffffff;
text-decoration: underline overline;
}


#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 14px;
display: none;
width: 145px;
float: left;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: bold;
padding-top: 2px;
border-top: 0px;
cursor: pointer;
color: #000000;
}
//-->

</style>

<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}

function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
<div class="menu">
<li><a href="http://zaza12.de.tl/G.ae.stebuch.htm">Gästebuch</a> </li>
<li><a onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" href="javascript:void(0);"> Music</a>
<ul onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" id="smenu2">
<li><a href="http://zaza12.de.tl/k.ue.rtce-mp3.htm">kurdisch</a></li>
<li><a href="http://zaza12.de.tl/zazaki-mp3.htm">Zaza</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
</ul>
</li>
<li><a onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" href="javascript:void(0);"> Videos</a>
<ul onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" id="smenu3">
<li><a href="http://www.zaza12.de.tl/s3.htm">Galatasaray</a></li>
<li><a href="http://www.zaza12.de.tl/s4.htm">Comics</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
<li> </li>
</ul>
</li>
<li><a href="http://zaza12.de.tl"> TITEL4</a></li>
<li><a onmouseout="cache('smenu5');" onmouseover="montre('smenu5');" href="javascript:void(0);"> TITEL5</a>
<ul onmouseout="cache('smenu5');" onmouseover="montre('smenu5');" id="smenu5">
<li><a href="http://zaza12.de.tl">Titel</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
</ul>
</li>
</div>
Beitrag15.08.2007 um 20:59 (UTC)    
Titel:

[quote="zaza12test"]Das ist jetzt meine Code

und wo soll ich die Klaasen einfügen Confused ?

Zitat:

<div align="center">

<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

div.menu
{
position: absolute;
z-index: 1;
top: 195px;
left: 200px;}


* html div.menu
{
position: absolute;
z-index: 1;

top: 195px;
left: 200px;}



.menu li
{
width: 145px;
float: left;
}

.menu a
{
background-color: #00fff0;
background-image: url();
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 1px;
display: block;
height: 25px;
color: #000000;
border: 3px double #fff;
}

.menu a:hover
{
background-color:;
background-image: url();
color: #ffffff;
text-decoration: underline overline;
}


#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 14px;
display: none;
width: 145px;
float: left;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: bold;
padding-top: 2px;
border-top: 0px;
cursor: pointer;
color: #000000;
}
//-->

</style>

<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}

function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
<div class="menu">
<li><a href="http://zaza12.de.tl/G.ae.stebuch.htm">Gästebuch</a> </li>
<li><a onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" href="javascript:void(0);"> Music</a>
<ul onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" id="smenu2">
<li><a href="http://zaza12.de.tl/k.ue.rtce-mp3.htm">kurdisch</a></li>
<li><a href="http://zaza12.de.tl/zazaki-mp3.htm">Zaza</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
</ul>
</li>
<li><a onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" href="javascript:void(0);"> Videos</a>
<ul onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" id="smenu3">
<li><a href="http://www.zaza12.de.tl/s3.htm">Galatasaray</a></li>
<li><a href="http://www.zaza12.de.tl/s4.htm">Comics</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
<li> </li>
</ul>
</li>
<li><a href="http://zaza12.de.tl"> TITEL4</a></li>
<li><a onmouseout="cache('smenu5');" onmouseover="montre('smenu5');" href="javascript:void(0);"> TITEL5</a>
<ul onmouseout="cache('smenu5');" onmouseover="montre('smenu5');" id="smenu5">
<li><a href="http://zaza12.de.tl">Titel</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
</ul>
</li>
</div>
Zitat:


So musst du den Code einfügen , das mit * html ignoriert der FF einfach. Da musst du jetzt den Wert TOP für den IE anpassen.
______________
[color=red:ac077f9a56]Gruß domi89[/color:ac077f9a56]



Zuletzt bearbeitet von domi89 am 15.08.2007, 22:00, insgesamt einmal bearbeitet
Beitrag15.08.2007 um 21:11 (UTC)    
Titel:

[quote="domi89"]
zaza12test hat Folgendes geschrieben:
Das ist jetzt meine Code

und wo soll ich die Klaasen einfügen Confused ?

Zitat:

<div align="center">

<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

div.menu
{
position: absolute;
z-index: 1;
top: 195px;
left: 200px;}


* html div.menu
{
position: absolute;
z-index: 1;

top: 250px;
left: 200px;}



.menu li
{
width: 145px;
float: left;
}

.menu a
{
background-color: #00fff0;
background-image: url();
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 1px;
display: block;
height: 25px;
color: #000000;
border: 3px double #fff;
}

.menu a:hover
{
background-color:;
background-image: url();
color: #ffffff;
text-decoration: underline overline;
}


#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 14px;
display: none;
width: 145px;
float: left;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: bold;
padding-top: 2px;
border-top: 0px;
cursor: pointer;
color: #000000;
}
//-->

</style>

<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}

function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
<div class="menu">
<li><a href="http://zaza12.de.tl/G.ae.stebuch.htm">Gästebuch</a> </li>
<li><a onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" href="javascript:void(0);"> Music</a>
<ul onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" id="smenu2">
<li><a href="http://zaza12.de.tl/k.ue.rtce-mp3.htm">kurdisch</a></li>
<li><a href="http://zaza12.de.tl/zazaki-mp3.htm">Zaza</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
</ul>
</li>
<li><a onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" href="javascript:void(0);"> Videos</a>
<ul onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" id="smenu3">
<li><a href="http://www.zaza12.de.tl/s3.htm">Galatasaray</a></li>
<li><a href="http://www.zaza12.de.tl/s4.htm">Comics</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
<li> </li>
</ul>
</li>
<li><a href="http://zaza12.de.tl"> TITEL4</a></li>
<li><a onmouseout="cache('smenu5');" onmouseover="montre('smenu5');" href="javascript:void(0);"> TITEL5</a>
<ul onmouseout="cache('smenu5');" onmouseover="montre('smenu5');" id="smenu5">
<li><a href="http://zaza12.de.tl">Titel</a></li>
<li><a href="http://zaza12.de.tl">Titel</a></li>
</ul>
</li>
</div>
Zitat:


So musst du den Code einfügen , das mit * html ignoriert der FF einfach. Da musst du jetzt den Wert TOP für den IE anpassen.


funktioniert leider nicht

ich hab den wert auch geändert Sad
Beitrag16.08.2007 um 11:14 (UTC)    
Titel:

Naja ich hab das mit der Positionierung nicht gelöst aber hab ne andere Lösung gefunden, sodass das Coolmenü immer in top_content bleibt.

indem ich,

den top_content bereich höher gemahct habe
Code:
{height:50 px;}


und mit dem navi_heading(navi titel und den sidebar_heading(rechte box-überschrift) gemacht habe...;
Code:
...{height:50px;}


und bei der positionirung
Code:
div.menu
{
position: absolute;
z-index: 1;
top: 215px;
left: 200px;}


eingestellt. Dann bleibt das menü immer im top content bereich...

und ich hab noch die höhe von navibuttons auf 20 px verkleinert...
Code:
{
...
...height:20 px;
...
}


ist so besser als gaarnichts

jetzt verschiebt sich das menü nicht im header oder im content bereich. die bleibt immer im top_content bereich.


ich muss noch passende Hintergrungbilder für top_content, navi_heading und sidebar_heading finden, dann sieht es besser aus zumindest Laughing


unter www.zaza12test.de.tl



mfg


Zuletzt bearbeitet von zaza12test am 16.08.2007, 12:17, insgesamt 2-mal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de