Schrift
Start · Board · Weitere Sprachen · HTML, CSS und Javascript
[thread]2277[/thread]

css: div zwischen 2 tabellen: firefox: nicht ok



<< >> 10 Einträge, 1 Seite
esskar
 2005-10-20 01:46
#24620 #24620
User since
2003-08-04
7321 Artikel
ModeratorIn

user image
bin etwas am basteln

Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<!-- TIMER START: process admin.tt -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<base href="http://sk:3000/" />

<title>OxWebMail v3.01 - Administration</title>

<meta name="language" content="de" />
<meta name="keywords" content="" />
<meta http-equiv="content-type" content=
"text/html; charset=utf-8" />
<meta http-equiv="cache-control" content=
"no-cache, must-revalidate, no-store, post-check=0, pre-check=0" />
<meta http-equiv="cache-control" content="private" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="pragma" content="private" />

<script language="Javascript" type="text/javascript" src=
"/static/javascript/misc.js"></script>

<link rel="stylesheet" href="/static/css/default.css" type="text/css" />
<style type="text/css"><!--
table
{
    width: 100%;
}
td
{
    vertical-align: middle;
    text-align: center;
}
//--></style>
</head>

<body>

<table border="0">
<tr>
    <td>
    <div class="windowAdmin">
    <form id="adminform" name="login" action="/login" method=
    "post" enctype="application/x-www-form-urlencoded">
    <input type="hidden" name="sid" value="" />

    <table border="0" cellpadding="4" cellspacing="0">
    <tr>
        <td class="topWindow"><img src="/static/images/admin.gif" width="22" height=
        "16" alt="Login" /></td>
        <td class="topWindow" width="100%">Administration</td>
    </tr>
    </table>

    <div id="navigation">

    <p><li><a href="">Global Setting</a></li>
    <li><a href="">Global Options</a></li>
    <li><a href="">Global Filter</a></li>
    <li><a href="">Global Addressbooks</a></li></p>

    <p><li><a href="">User Management</a></li></p>
    </div>

    <div id="contentAdmin">
    </div>

    <table border="0" cellpadding="4" cellspacing="0">
    <tr>
        <td class="bottomWindow" width="100%"><input id="signinbutton" type=
        "submit" class="formButton" value="Apply Changes" name="applychanges" /></td>
    </tr>
    </table>
    </form>

    </div>
    </td>
</tr>
</table>

</body>
</html>
<!-- TIMER END: process admin.tt (0.00031 seconds) -->


das css ist angehängt.

wieso zeigt firefox die navigation zwischen den 2 tabellen an.
opera und ie schon.
pKai
 2005-10-20 02:21
#24621 #24621
User since
2005-02-18
357 Artikel
BenutzerIn
[default_avatar]
Diskussionen über das Rendering von non-validem HTML/CSS kommen mir immer ein bißchen wie Kaffeesatzleserei vor.
I sense a soul in search of answers.
esskar
 2005-10-20 02:44
#24622 #24622
User since
2003-08-04
7321 Artikel
ModeratorIn

user image
ok; hier ne gefixte version

Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!-- TIMER START: process admin.tt -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<base href="http://sk:3000/">

<title>OxWebMail v3.01 - Administration</title>

<meta name="language" content="de">
<meta name="keywords" content="WebMail">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="cache-control" content="no-cache, must-revalidate, no-store, post-check=0, pre-check=0">
<meta http-equiv="cache-control" content="private">
<meta http-equiv="expires" content="0">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="pragma" content="private">

<script language="Javascript" type="text/javascript" src="/static/javascript/misc.js"></script>

<link rel="stylesheet" href="/static/css/default.css" type="text/css">
<style type="text/css">
table
{
    width: 100%;
}
td
{
    vertical-align: middle;
    text-align: center;
}
</style>

</head>

<body>

<table border="0">
<tr>
    <td>
    <div class="windowAdmin">
    <form id="adminform" name="login" action="/login" method=
    "post" enctype="application/x-www-form-urlencoded">
    <input type="hidden" name="sid" value="" />

    <table border="0" cellpadding="4" cellspacing="0">
    <tr>
        <td class="topWindow"><img src="/static/images/admin.gif" width="22" height=
        "16" alt="Login" /></td>
        <td class="topWindow" width="100%">Administration</td>
    </tr>
    </table>


    <div id="navigation">

    <menu><li><a href="">Global Setting</a></li>
    <li><a href="">Global Options</a></li>
    <li><a href="">Global Filter</a></li>
    <li><a href="">Global Addressbooks</a></li>

    <li><a href="">User Management</a></li></menu>
    </div>

    <div id="contentAdmin">
    </div>

    <table border="0" cellpadding="4" cellspacing="0">
    <tr>
        <td class="bottomWindow" width="100%"><input id="signinbutton" type=
        "submit" class="formButton" value="Apply Changes" name="applychanges" /></td>
    </tr>
    </table>
    </form>

    </div>
    </td>
</tr>
</table>

</body>
</html>
<!-- TIMER END: process admin.tt (0.000312 seconds) -->


besser wurde es aber dadurch nicht!\n\n

<!--EDIT|esskar|1129761921-->
pKai
 2005-10-20 11:38
#24623 #24623
User since
2005-02-18
357 Artikel
BenutzerIn
[default_avatar]
Beschreib bitte nochmal genauer, was dein Problem ist.
Bei mir sieht die Seite nämlich im IE6/FF1.0.4/Netscape8 immer gleich aus.
Zur besseren Sichtung habe ich die border der beiden inneren table auf 1 gesetzt. Ich bekomme dann oben und unten je einen "100%" kasten und dazwischen mittig das Menu.
Natürlich kann ich lokal die "base sk:3000" nicht auflösen, so dass ich oben kein Bild sehe und auch keine misc.js geladen wird. Aber das sollte ja wohl kein Problem sein?!
I sense a soul in search of answers.
esskar
 2005-10-20 14:46
#24624 #24624
User since
2003-08-04
7321 Artikel
ModeratorIn

user image
ich poste heute abend mal 2 screen shots
esskar
 2005-10-21 01:55
#24625 #24625
User since
2003-08-04
7321 Artikel
ModeratorIn

user image
mein FF1.04 stellt das ganze so da (siehe anhang)
pKai
 2005-10-21 02:47
#24626 #24626
User since
2005-02-18
357 Artikel
BenutzerIn
[default_avatar]
OK, durch das <base>, was ich drin gelassen hatte, hatte er das CSS garnicht gefunden. Daher hatte ich immer das selbe gesehen.

Minimal(?)-Beispiel um das Problem zu illustrieren:
Code: (dl )
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<title>Titel</title>

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >

<style type="text/css"><!--
table
{
    width: 100%;
}

#navigation {
    float: left;
}
//--></style>
</head>

<body>

<table>
<tr>
    <td>
    <div>

    <table border="1">
    <tr>
        <td>&nbsp;</td>
    </tr>
    </table>

    <div id="navigation">

    Links

    </div>

    <table border="1">
    <tr>
        <td>&nbsp;</td>
    </tr>
    </table>

    </div>
    </td>
</tr>
</table>

</body>
</html>

Die Frage ist halt, was "width:100%" hier bedeutet. Jemand der das Box-Modell besser als ich kennt, sollte das vielleicht beantworten können?!
I sense a soul in search of answers.
pKai
 2005-10-21 02:53
#24627 #24627
User since
2005-02-18
357 Artikel
BenutzerIn
[default_avatar]
"Workaround" (Jedenfalls für mein verkürztes Bsp):
Code: (dl )
    <table border="1" style="clear:left">
als Definition der unteren Tabelle.\n\n

<!--EDIT|pKai|1129848809-->
I sense a soul in search of answers.
renee
 2005-10-21 05:59
#24628 #24628
User since
2003-08-04
14371 Artikel
ModeratorIn
[Homepage] [default_avatar]
Du kannst ja mal versuchen margin- und padding-Werte explizit auf 0 setzen...
OTRS-Erweiterungen (http://feature-addons.de/)
Frankfurt Perlmongers (http://frankfurt.pm/)
--

Unterlagen OTRS-Workshop 2012: http://otrs.perl-services.de/workshop.html
Perl-Entwicklung: http://perl-services.de/
pKai
 2005-10-21 10:07
#24629 #24629
User since
2005-02-18
357 Artikel
BenutzerIn
[default_avatar]
Bringt nix.

Bei einem privatem Webseitenprojekt hatte ich neulich im Prinzip das gleiche Problem nur unter umgekehrten Vorzeichen.
Das Layout war CSS-basiert 3-Spaltig. Nur wenn ich im mittleren DIV-Container width:100% verwendet habe, hat es mir im IE das Layout zerhauen.
Dort hab ich dann letztlich in den sauren Apfel gebissen und für IE über IE-Conditional-Includes für die Stelle ein width:auto hereingezogen.
Insofern wäre ich für eine Aufklärung was da genau passiert Box-Modell-mäßig auch sehr dankbar. Insbesonder falls sich dadurch ein Ansatz ergibt wie man es "allen Recht machen" kann ;)
I sense a soul in search of answers.
<< >> 10 Einträge, 1 Seite



View all threads created 2005-10-20 01:46.