Suche im Forum:
Suchen


Autor Nachricht
Beitrag18.05.2009 um 18:29 (UTC)    
Titel: Design optimieren (gibt Belohnung)

Hallo, ich hätte gerne folgendes Design optimiert: (das heißt, es soll von fast allen Auflösungen aus gleich aussehen.)

Es soll am Ende so wie dieses Bild hier aussehen:

http://gfx-zone.bplaced.net/uploads/images/opt1242672448w.png

Für den jenigen, der mir Hilft, gibt es eine Werbebeloungen, heißt:
Er darf für 4 Wochen einen banner auf meine Seite oder auch einen link

Hier mein Code


Text über dem Design:

Zitat:

<div id="Header_oben"></div>
<div id="Contenthintergrund"></div>
<div id="Kachelkrack"></div>





Ohne Styletags:


Zitat:

/*Das unsichtbare Copyright darf nicht entfernt werden*/
/*Copyright by DonChick*/

#container {width: 984px; margin: auto;}
div#header_container {visibility: hidden; width: 922px; margin-left: auto; margin-right: auto;}
li.nav_element{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
li.nav_element{display: none;}
li.nav_element a{display: none;}
div.header{display: none;}
#counter {display: none;}

a{color:#800000; font-size: 15px; text-decoration: none;}
a:hover {color: #800000; font-size: 15px; text-decoration: none;}
a:link {color: #800000; font-size: 15px; text-decoration: none;}
a:active {color: #800000; font-size: 15px; text-decoration: none;}
a:visited {color: #800000; font-size: 15px; text-decoration: none;}

body {background-color:#0099ff;}


#Kachelkrack {
margin: auto;
width: 984px;}

#Header_oben {
position: absolute;
top: 46px;
left: 2%;
color: #FFFFFF;
width: 950px;
height: 232px;
background-image: url(http://gfx-zone.bplaced.net/uploads/images/opt1242667526p.png);
padding: 0px;
border: 0px solid #CCCCCC;}

#content {
position: relative;
top: 270px;
height: 450px;
left: 5%;
width: 880px;
background: #XXXXXX;
color: #000000;
border: 0px solid #FFFFFF;
padding: 0px;
overflow:auto;}

#Contenthintergrund {
position: absolute;
top: 270px;
left: 1%;
height: 500px;
width: 986px;
background:url(http://gfx-zone.bplaced.net/uploads/images/opt1242668993f.png);
color: #000000;
border: 0px solid #CCCCCC;
padding: 0px;
overflow:auto;}

/*Ab hier beginnt das Coolmenü*/

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

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

li a
{
padding-right: 22px;padding-top: 7px;
}

div.menu
{
position: absolute;
z-index: 3;
top: 258px;
left: 44%;
margin-left:-405px;
width: 950px;
}

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

.menu a
{
border: 0px solid #000000;
background-color: #000000;
background-image: url(http://gfx-zone.bplaced.net/uploads/images/klz1242669489m.png);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 32px;
color: #FFFFFF;
}

.menu a:hover
{
background-color: #00CCFF;
background-image: url(http://gfx-zone.bplaced.net/uploads/images/cqs1242669495g.png);
}

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

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

</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="LINK1"> TITEL1</a> </li>
<li><a onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" href="javascript:void(0);"> TITEL2</a>
<ul onmouseout="cache('smenu2');" onmouseover="montre('smenu2');" id="smenu2">
<li><a href="UNTERLINK2.3">Titel</a></li>
<li><a href="UNTERLINK2.3">Titel</a></li>
<li><a href="UNTERLINK2.4">Titel</a></li>
<li><a href="UNTERLINK2.5">Titel</a></li>
<li><a href="UNTERLINK2.6">Titel</a></li>
<li><a href="UNTERLINK2.7">Titel</a></li>
</ul>
</li>
<li><a onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" href="javascript:void(0);"> TITEL3</a>
<ul onmouseout="cache('smenu3');" onmouseover="montre('smenu3');" id="smenu3">
<li><a href="UNTERLINK3.2">Titel</a></li>
<li><a href="UNTERLINK3.3">Titel</a></li>
<li><a href="UNTERLINK3.4">Titel</a></li>
<li> </li>
</ul>
</li>
<li><a href="LINK4"> 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="LINK5.1">Titel</a></li>
<li><a href="LINK5.2">Titel</a></li>
</ul>
</li>
</div>


MFG Julian Wink
______________
Ich werde im Forum bleiben, meine seiten werden allerdings gelöscht


Zuletzt bearbeitet von donchick am 18.05.2009, 19:47, insgesamt einmal bearbeitet
Beitrag18.05.2009 um 18:49 (UTC)    
Titel:

Hi,

das einzige was an deinem Design nicht passt, ist das Menü, oder?
um das Menü zu verbessern ersetzte:
Code:

div.menu
{
position: absolute;
z-index: 3;
top: 3px;
left: 25px;
margin-left:-auto; margin-right: left;
width:950px;
}


Durch
Code:
div.menu
{
top: 3px;
left: 45px;
margin-left: auto;
margin-right: auto;
width:950px;
}


Und dein Menü ist mittig! Dein Design müsste dann in allen Bildschirmauflösungen perfekt aussehen!

Ich hoffe ich konnte dir helfen! Wenn ja dann müsste ich jetzt ja eigl. ne Belohnung bekommen Very Happy

MfG SmaX
______________


Zuletzt bearbeitet von pro-gfx am 18.05.2009, 19:51, insgesamt 2-mal bearbeitet
Beitrag18.05.2009 um 19:24 (UTC)    
Titel:

ich überprüfe mal bis morgen.
wenn ja natürlich.
Vielen Dank, auf solche user kann man sich verlassen
MFG
______________
Ich werde im Forum bleiben, meine seiten werden allerdings gelöscht
Beiträge der letzten Zeit anzeigen:   


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