Unterschiedliche Darstellung bei margin
Noobie
- css
Hallo Gemeinde,
ich habe folgendes Problem:
Über CSS "layoute" ich eine Tabelle, diese soll 280 px vom linken Rand anfangen und dann dynamisch 6 Zellen anzeigen:
CSS:
TABLE.nav{
background-color:#EDEDED;
border-collapse:collapse;
border:0px;
width:100%;
margin: 0px 0px 0px 280px;
}
HTML:
<table id="nav" class="nav">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
Der Feuerfuchs zeigt meines erachtens alles richtig an: Tabelle wird 280 px von links angezeigt und die Zellen fliessen dynamisch im Browser. Verkleiner ich die Browsergröße, verkleinern sich auch die Zellengrößen.
Der IE zeigt mir zwar die Tabelle 280 px von links an, zeigt dann aber nur bis Zelle "5". Verkleiner ich den Browser, sehe ich noch weniger Zellen. Einen Scrollbalken zeigt der IE nicht.
Was läuft falsch, jemand eien Idee ??
Mercy
Noobie
CSS:
wichtig wäre auch zu Wissen wie dein DOCTYPE aussieht.
TABLE.nav{
width:100%;
margin: 0px 0px 0px 280px;
Also 100% + margin 280px, damit hast du auf jeden Fall einen scrollbalken.
Der IE zeigt mir zwar die Tabelle 280 px von links an, zeigt dann aber nur bis Zelle "5". Verkleiner ich den Browser, sehe ich noch weniger Zellen. Einen Scrollbalken zeigt der IE nicht.
Das der IE keinen Scrollbalken zeigt, glaube ich dir nicht oder du verheimlichst uns noch Code.
Struppi.
Das der IE keinen Scrollbalken zeigt, glaube ich dir nicht oder du verheimlichst uns noch Code.
Musst Deine Glaskugel mal wieder putzen: Kein Scrollbalken !
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link rel="stylesheet" type="text/css" href="layout.css">
<title>test</title>
</head>
<body>
<div id="pagewidth" >
<div id="header" >
<table id="navi" class="navi">
<tr>
<td><img src="images/logo.jpg" alt="logo"></td>
</tr>
<tr>
<td>
<table id="nav" class="nav">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<div id="wrapper" class="clearfix" >
<div id="maincol" > Main Content Column </div>
<div id="leftcol" > Left Column </div>
</div>
<div id="footer" > Footer
</div>
</div>
</body>
</html>
Und der CSS Style von csscreator.com:
html, body{
margin:0;
padding:0;
}
#pagewidth{
max-width:100%;
min-width:100%;
}
#header{
position:relative;
height:180px;
background-color:#EDEDED;
width:100%;
}
#leftcol{
width:271px;
float:left;
position:relative;
background-color:#39FC60;
height:400px;
}
#maincol{background-color: #FFFFFF;
float: right;
display:inline;
position: relative;
height:400px;
}
#footer{
height:20px;
background-color:#46FCCF;
clear:both;
}
TABLE.navi{
border-collapse:collapse;
border:0px;
width:100%;
background-image:url(images/back_nav.jpg);
}
TABLE.nav{
background-color:#EDEDED;
border-collapse:collapse;
border:0px;
width:100%;
margin: 0px 0px 0px 280px;
}
/* *** Float containers fix:
http://www.csscreator.com/attributes/containedfloat.php *** */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix{display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */
/*printer styles*/
@media print{
/*hide the left column when printing*/
#leftcol{display:none;}
#footer{display:none;}
#twocols, #maincol{width:100%; float:none;}
}
FG Noobie
Das der IE keinen Scrollbalken zeigt, glaube ich dir nicht oder du verheimlichst uns noch Code.
Musst Deine Glaskugel mal wieder putzen: Kein Scrollbalken !
Ich hab den Code benutzt den du uns hier gezeigt hast, damit gibt es einen Scrollbalken. Versuch mal deinen Code so einzuschränken, dass das Problem nachvollziehbar ist.
Struppi.
Ich hab den Code benutzt den du uns hier gezeigt hast, damit gibt es einen Scrollbalken. Versuch mal deinen Code so einzuschränken, dass das Problem nachvollziehbar ist.
Bei mir gibt es weder im IE noch im Firefox einen Scrollbalken ! Und es ist exakt der Code den ich gepastet habe. Wobei das mit dem Scrollbalken eigendlich ja nicht mein Problem ist.
Du schreibst 100% + margin 280px . Bedeutet das, das wenn ich eine Tabelle mit 100% mit margin setzte, das dann die 100% plus margin angezeigt werden? Ist das das Standardverhalten der Browser??
LG Noobie
Ich hab den Code benutzt den du uns hier gezeigt hast, damit gibt es einen Scrollbalken. Versuch mal deinen Code so einzuschränken, dass das Problem nachvollziehbar ist.
Bei mir gibt es weder im IE noch im Firefox einen Scrollbalken ! Und es ist exakt der Code den ich gepastet habe. Wobei das mit dem Scrollbalken eigendlich ja nicht mein Problem ist.
Wollen wir uns jetzt darüber streiten, was du hier geschrieben hast?
Du hast Exakt (ergänzt um die fehlendenen notwendigen Elemente) den Code gezeigt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<style>
TABLE.nav{
background-color:#EDEDED;
border-collapse:collapse;
border:0px;
width:100%;
margin: 0px 0px 0px 280px;
}
</style>
</head>
<body>
<table id="nav" class="nav">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
</body>
</html>
und damit erhalte ich im IE einen Scrollbalken, wenn das bei dir nicht so ist, dann ist dein IE kaputt.
Du schreibst 100% + margin 280px . Bedeutet das, das wenn ich eine Tabelle mit 100% mit margin setzte, das dann die 100% plus margin angezeigt werden? Ist das das Standardverhalten der Browser??
Jein (du kennst den Boxmodellbug? spielt aber für dich keine Rolle)
Struppi.
Wollen wir uns jetzt darüber streiten, was du hier geschrieben hast?
Nein, denn Du hast recht ;-) (ich habe nicht den ganzen Code gepastet, mit dem was ich geschrieben habe bekommst man einen Scrollbalken!)
Hier der ganze Quellcode und weiter unten das CSS. Dieses liegt als seperates Dokument bereit und wird als layout.css eingebunden.
Wenn Du Dir da mal den Unterschied zwischen IE und FF anschaust kommt kein Scrollbalken. Der IE zeigt aber was Anderes an als der FF (ach ne!:)
LG Noobie
....oder du verheimlichst uns noch Code.
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Musst Deine Glaskugel mal wieder putzen
Glaub ich nicht, das ist genau das was ich geahnt habe, dass du uns was verheimlichst.
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
Das würde ich nicht tun, damit können viele deine Seite u.U. nicht lesen.
<link rel="stylesheet" type="text/css" href="layout.css">
^^^^^^^^^^
Aha?
Und der CSS Style von csscreator.com:
interessanter wäre der aus der layout.css
Meiner Meinung nach postitionierst du viele zu viele Elemente und dein Code hat zumindest Tendenzen einer DIV Suppe. Das was du suchst gibt es als fertiger Vorlagen auch im Netz, such mal nach YAML
Struppi.