Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag21.09.2009 um 14:22 (UTC)    
Titel: Design CSS: Navigation sitzt schief

Also ich hab ne frage..mein css code stimmt zwar bei mir schon
aber wenn ich mit andere browser gucke
dann sieht meine navi irgendwie schief oder so
hab code von nem freund
aber viele sagen das mein homepage voll schief aussieht
deswegen frage für profis
könnt ihr mir mit code helfen??

HIER IST CODE


/* Diese Klassen werden nicht angezeigt */
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
div.header{display: none;}
h1#title{display: none;}

/* Gestalten der Links */
a:link {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:visited {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:hover {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

body {
background-image: url(http://i29.tinypic.com/avfmus.jpg);}

*{ padding: 0; margin: 0; }

http://i29.tinypic.com/2vazg38.png{
margin: 0 auto;
width: 1285px;
height: 780px;
background-image:url(http://i29.tinypic.com/2vazg38.png);}

#header_container {
position: absolute;
left: 36%;
top: 80px;
margin-left:-490px;
width: 1024px;
height:768px;
background-color:#transperent;
background-image:url(http://i29.tinypic.com/2iw9cmc.jpg);
color:#7400c7;
font-size:10px;
border: 1px solid #transperent;;}


#content {
position: absolute;
left: 53%;
top: 320px;
margin-left:-250px;
width: 500px;
height: 510px;
padding:0px;
color: #7400c7;
font-size:8px;
font-family:verdana;
background-color:transperent;
background-image:url();
border: 1px solid transperent;
overflow:auto;}

#nav_container{
position: absolute;
left: 59%;
top: 430px;
margin-left: -545px;
width: 50px;
border: 0px solid #FFFFF0;}

ul#nav{
width: 50px;
padding: 0px;
margin: 0px;}

li.nav_element{
list-style-type: none;
position: relative;
padding:3px;
width: 80px;}

li.nav_element a{
display: block;
width: 86px;
padding:2px;
font-size:9px;
font-family:verdana;
font-weight: bold;
text-decoration: none;
text-align: left;
color:transparent;
background-color:transparent;
background-image:url(HIER BUTTON-ULR_1);
border: 2px solid transparent;}

li.nav_element a:hover{
color: transparent;
background-color:transparent;
background-image:url(HIER BUTTON-URL_2);}

#counter {
position: absolute;
left: 24%;
top:805px;
margin-left: -320px;
width: 150px;
height:20px;
color:#7400c7;
font-size:13px;
border: 1px solid transparent;}


Zuletzt bearbeitet von diamond-gb am 22.09.2009, 16:01, insgesamt einmal bearbeitet
Beitrag21.09.2009 um 14:23 (UTC)    
Titel:

Wie sieht es denn bei dir aus,
mache doch mal einen Screenshot.
Beitrag21.09.2009 um 14:26 (UTC)    
Titel:

ja bei mir sieht es alles ok aus
bei andere sieht es anders aus
irgendwie ist da falsche auflösung oder so kein plan
Beitrag21.09.2009 um 15:11 (UTC)    
Titel:

diamond-gb hat Folgendes geschrieben:
ja bei mir sieht es alles ok aus
bei andere sieht es anders aus
irgendwie ist da falsche auflösung oder so kein plan


Dann mache doch mal einen Shot,

würde gerne wissen wie es richtig aussehen soll.
Beitrag22.09.2009 um 15:03 (UTC)    
Titel:

Hallo,

Welchen Browser verwedest du?
> Mozilla Firefox?
> Internet Explorer?
> Opera?
> Google Chrome?
> Safari?
Und wenns geht bitte mit Version angeben. Hier mal ein Bild, was es erkennen sollte:


Gegebenenfalls hilft es Cookies & Cache zu löschen:
http://www.homepage-baukasten.de/forum/viewtopic.php?t=101555

Außerdem wäre es vielleicht nicht schlecht, wenn wir sehen könnten, was nicht stimmt. Dafür ist ein Screenshot praktisch. Wie das geht, steht hier:
http://www.homepage-baukasten.de/forum/viewtopic.php?t=63937


Liebe Grüße,

Jan aka "Asgar"
______________
Beitrag22.09.2009 um 16:58 (UTC)    
Titel:

@all
Die Navi und der Content haben eine andere positionsangabe:
Drücke STRG + [scrollen] und man sieht es! Am besten den Code noch mal überarbeiten!

vg tjpeiler

EDIT:

Zitat:
/* Diese Klassen werden nicht angezeigt */
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
div.header{display: none;}
h1#title{display: none;}

/* Gestalten der Links */
a:link {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:visited {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:hover {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

body {
background-image: url(http://i29.tinypic.com/avfmus.jpg);}

*{ padding: 0; margin: 0; }

http://i29.tinypic.com/2vazg38.png{
margin: 0 auto;
width: 1285px;
height: 780px;
background-image:url(http://i29.tinypic.com/2vazg38.png);}

#header_container {
position: absolute;
left: 36%;
top: 80px;
margin-left:-490px;

width: 1024px;
height:768px;
background-color:#transperent;
background-image:url(http://i29.tinypic.com/2iw9cmc.jpg);
color:#7400c7;
font-size:10px;
border: 1px solid #transperent;;}


#content {
position: absolute;
left: 53%;
top: 320px;
margin-left:-250px;

width: 500px;
height: 510px;
padding:0px;
color: #7400c7;
font-size:8px;
font-family:verdana;
background-color:transperent;
background-image:url();
border: 1px solid transperent;
overflow:auto;}

#nav_container{
position: absolute;
left: 59%;
top: 430px;
margin-left: -545px;

width: 50px;
border: 0px solid #FFFFF0;}

ul#nav{
width: 50px;
padding: 0px;
margin: 0px;}

li.nav_element{
list-style-type: none;
position: relative;
padding:3px;
width: 80px;}

li.nav_element a{
display: block;
width: 86px;
padding:2px;
font-size:9px;
font-family:verdana;
font-weight: bold;
text-decoration: none;
text-align: left;
color:transparent;
background-color:transparent;
background-image:url(HIER BUTTON-ULR_1);
border: 2px solid transparent;}

li.nav_element a:hover{
color: transparent;
background-color:transparent;
background-image:url(HIER BUTTON-URL_2);}

#counter {
position: absolute;
left: 24%;
top:805px;
margin-left: -320px;

width: 150px;
height:20px;
color:#7400c7;
font-size:13px;
border: 1px solid transparent;}


Beim BG wird "margin: 0 auto;" benutzt und bei den anderen Sachen "position:absolute;"/"left: 25%" etc.
Allein bei BG und dem Rest solltest du entweder "margin: 0 auto" oder das andere wählen, noch dazu solltest du nicht zwischen px und % schwanken!

Also nochmal überarbeiten!


Zuletzt bearbeitet von tjpeiler-designs am 22.09.2009, 18:03, insgesamt einmal bearbeitet
Beitrag22.09.2009 um 19:54 (UTC)    
Titel:

ich benutze mozilla
Beitrag22.09.2009 um 20:14 (UTC)    
Titel:

tjpeiler-designs hat Folgendes geschrieben:
@all
Die Navi und der Content haben eine andere positionsangabe:
Drücke STRG + [scrollen] und man sieht es! Am besten den Code noch mal überarbeiten!

vg tjpeiler

EDIT:

Zitat:
/* Diese Klassen werden nicht angezeigt */
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
div.header{display: none;}
h1#title{display: none;}

/* Gestalten der Links */
a:link {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:visited {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

a:hover {
color: #4A9AF6;
font-size: 13px;
text-decoration: none;}

body {
background-image: url(http://i29.tinypic.com/avfmus.jpg);}

*{ padding: 0; margin: 0; }

http://i29.tinypic.com/2vazg38.png{
margin: 0 auto;
width: 1285px;
height: 780px;
background-image:url(http://i29.tinypic.com/2vazg38.png);}

#header_container {
position: absolute;
left: 36%;
top: 80px;
margin-left:-490px;

width: 1024px;
height:768px;
background-color:#transperent;
background-image:url(http://i29.tinypic.com/2iw9cmc.jpg);
color:#7400c7;
font-size:10px;
border: 1px solid #transperent;;}


#content {
position: absolute;
left: 53%;
top: 320px;
margin-left:-250px;

width: 500px;
height: 510px;
padding:0px;
color: #7400c7;
font-size:8px;
font-family:verdana;
background-color:transperent;
background-image:url();
border: 1px solid transperent;
overflow:auto;}

#nav_container{
position: absolute;
left: 59%;
top: 430px;
margin-left: -545px;

width: 50px;
border: 0px solid #FFFFF0;}

ul#nav{
width: 50px;
padding: 0px;
margin: 0px;}

li.nav_element{
list-style-type: none;
position: relative;
padding:3px;
width: 80px;}

li.nav_element a{
display: block;
width: 86px;
padding:2px;
font-size:9px;
font-family:verdana;
font-weight: bold;
text-decoration: none;
text-align: left;
color:transparent;
background-color:transparent;
background-image:url(HIER BUTTON-ULR_1);
border: 2px solid transparent;}

li.nav_element a:hover{
color: transparent;
background-color:transparent;
background-image:url(HIER BUTTON-URL_2);}

#counter {
position: absolute;
left: 24%;
top:805px;
margin-left: -320px;

width: 150px;
height:20px;
color:#7400c7;
font-size:13px;
border: 1px solid transparent;}


Beim BG wird "margin: 0 auto;" benutzt und bei den anderen Sachen "position:absolute;"/"left: 25%" etc.
Allein bei BG und dem Rest solltest du entweder "margin: 0 auto" oder das andere wählen, noch dazu solltest du nicht zwischen px und % schwanken!

Also nochmal überarbeiten!


ich verstehe das nicht
Beitrag23.09.2009 um 13:15 (UTC)    
Titel:

Hast du das Design nicht selber gemacht?
Beitrag23.09.2009 um 13:36 (UTC)    
Titel:

nein hab von freund gekriegt
Beiträge der letzten Zeit anzeigen:   


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