PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : width soll 100px werden!


MadMan2k
2003-10-19, 17:20:34
am besten schaut ihr das Problem selbst an:
http://mitglied.lycos.de/madman2k3/konstrukt.html

ich will, dass das label oben die ihm zugewiesene breite "100px" annimmt und nicht die minimal benötigte.

Dies macht es aber nur, wenn ich "float" oder "block" benutze.
Dann ist aber das Design im A.... Eimer. (unten)

Nase
2003-10-19, 17:55:48
Quatsch, was ich vorher geschrieben hab, also wieder gelöscht.

Allerdings ist in beiden Beispielen von dir das Label 100px breit. Bei mir zumindest @ IE 6.

MadMan2k
2003-10-19, 19:14:12
stimmt, habs auch grad ausprobiert - dann besteht das problem nur bei Mozilla...

Nase
2003-10-19, 19:49:31
Hmmm, mal ne Frage. Musst du unbedingt labels benutzen? Geht ja schliesslich auch ganz gut ohne :)

Nase
2003-10-19, 20:07:46
Argh, das ist auch ein Quatsch hier. Ich habe da mal ein bisschen drin rumgewurschtelt und mein krankes Hirn hat das hier hervorgebracht:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Konstrukt</title>
<style type="text/css">
<!--
.eingabe{
border-top: 1px solid #4E4949;
background-color: #AFAFAF;
padding: 0px 0px;
width: 400px;
}
label {
background-color: #8F8F8F;
width: 100px;
border-right: 1px solid #4E4949;
padding: 2px;
margin-right: 2px;
}
input {
border: 1px solid;
}
-->
</style>
</head>
<body>
<div class="eingabe"><label for="name">Name:</label><input type="text" name="Name" id="name" size="35" maxlength="30" /></div>
<br />
<div class="eingabe"><label for="name1" style="float: left;">Name1:</label>
<input type="text" name="Name1" id="name1" size="35" maxlength="30" /></div>
</body>
</html>

Wie es aussieht, kannst du im Anhang sehen. Ich denke mal so sollte es auch sein (im IE6 sieht es jedenfalls ziemlich gut aus ;)).

Tja, zu Mozilla kann ich nur sagen: TEUFEL!!! Als ob es nicht schon genug hin und her ist, das auf dem IE und Opera einigermaßen vernünftig aussehen zu lassen. Ich kann dem Teil auf jedenfall nichts gutes abgewinnen. Deswegen würde ich auch behaupten, entweder optimiert für IE/Opera oder für NS/Mozilla, aber alles scheint mir in keinen Fall möglich, sobald es etwas komplexer wird mit dem Code.

Aqualon
2003-10-19, 22:55:25
@Nase: Der Code den du gepostet hast, sieht bei mir von der Labelbreite im IE6 und Mozilla 1.5 genau gleich aus.

Das heisst, das obere Label hat keine 100 Pixel Breite, das untere dagegen schon.

Aqua

Edit: Die Originalseite von MadMan2k sieht bei mir in beiden Browsern auch gleich aus.

MadMan2k
2003-10-19, 23:30:36
Original geschrieben von Nase
Hmmm, mal ne Frage. Musst du unbedingt labels benutzen? Geht ja schliesslich auch ganz gut ohne :)
nö, müssen keine labels sein.
im moment verwende ich 2divs dazu:
http://mitglied.lycos.de/madman2k3/index.php?seite=guestbook

am besten geht das ja immernoch mit tabellen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>Konstrukt</title>
<style type="text/css">
<!--
*{margin:0px; padding:0px;}
.eingabe{
background-color: #AFAFAF;
border-top: 1px solid #4E4949;
padding: 2px 1px; orul
width: 400px;
}
.label {
background-color: #8F8F8F;
width: 100px;
border-right: 1px solid #4E4949;
border-top: 1px solid #4E4949;
}
input {
border: 1px solid #AFAFAF;
}
-->
</style>
</head>
<body>
<table cellspacing="0" style="width: 400px">
<tr>
<td class="label">Name:</td>
<td class="eingabe"><input type="text" name="Name" id="name" size="35" maxlength="30" /> </td>
</tr>
<tr>
<td class="label">Name1:</td>
<td class="eingabe"><input type="text" name="Name1" id="name1" size="35" maxlength="30" /> </td>
</tr>
</table>
</body>
</html>

aber irgendwie sind die ja jetzt uncool geworden und die label + input in div methode ist ja auch eleganter...

Nase
2003-10-20, 09:58:50
Ich find Tabellen geil. Ich pack alles in Tabellen.

@Aqualon: So sollte es eigentlich auch sein ;)

Aqualon
2003-10-20, 12:48:49
Original geschrieben von Nase
@Aqualon: So sollte es eigentlich auch sein ;)

Irgendwie steh ich gerade auf dem Schlauch :kratz:

Das Problem von MadMan2k war doch, dass das Label nur dann 100px breit ist, wenn style="float: left;" ist. Laut seiner Schilderung tritt dieses Problem aber nur in Mozilla auf.

Wenn ich die Seite allerdings in IE6 und Mozilla 1.5 öffne, sieht sie genau gleich aus. Das obere Label ohne style="float: left;" ist keine 100px breit, das unter mit style="float: left;" jedoch schon. Und das auch im IE6, in dem es laut MadMan2k ja funktionieren soll (d.h. beide Label sollen 100px breit sein).

Hab ich da ein grundlegendes Verständnisproblem?

Aqua

P.S. divs würd ich Tabellen auch vorziehen, vorallem weil man die super hin- und herschieben kann ohne sich groß Gedanken wegen der Tabellenstruktur zu machen.

Nase
2003-10-20, 12:57:45
Meiner Ansicht nach ging es darum, dass, wenn er style="float: left;" das Design zerstört wird. In meiner Lösung ist das nicht der Fall.

Black-Scorpion
2003-10-20, 15:22:37
So sollte es bestimmt nicht aussehen.
Mit Firebird 0.7 der erste Link.

MadMan2k
2003-10-20, 16:03:46
ok, also mir ging es darum das hier (http://mitglied.lycos.de/madman2k3/tabelle.html) mithilfe eines divs in dem das label und der input drin sind darzustellen oder auch mit zwei divs oder..
hautsächlich kam es mir darauf an, dass es keine tabellen sind und dass es im IE6/FB 0.7 gleich aussieht.

das krieg ich auch ganz gut hin, wenn ich nicht gerade float benutze, denn das verzerrt das ganze dermaßen, dass es nahezu unmöglich ist es in beiden Browsern gleich aussehen zu lassen, also hab ich gefragt, ob man die labels denn nicht auch ohne float dazu zwingen kann width: 100px anzunehmen...

Edit: ich nehme mal an, das hat irgendwas damit (http://www.w3.org/TR/xsl/slice4.html#area-geo) zu tun.
Gibts da nicht auch was mit codebeispielen?

Black-Scorpion
2003-10-20, 16:38:25
Schau mal hier nach.
Das sollte helfen.
http://www.drweb.de/csstechnik/layer_formular.shtml

MadMan2k
2003-10-20, 17:39:34
tja, ein problem gelöst, zwei neue aufgetaúcht... oder so...
ich hab jetzt zwar 100px breite, kann aber die labels nicht färben, da er sonst den oberen border übermalt.. :(

http://mitglied.lycos.de/madman2k3/probleme.php

Nase
2003-10-20, 19:04:41
Wie wärs mit

border-top: 1px solid black;

im label ergänzen.

Ist zwar nicht schon, aber funktioniert.


P.S.: Wenn ich sowas schon sehe, dann soll mir doch mal einer klar machen, warum CSS-Styles besser sein sollen als Tabellen. Damit hätte ich das nämlich in 3 Minuten fertig.

MadMan2k
2003-10-20, 19:26:10
Original geschrieben von Nase
Wie wärs mit

border-top: 1px solid black;

im label ergänzen.

Ist zwar nicht schon, aber funktioniert.


P.S.: Wenn ich sowas schon sehe, dann soll mir doch mal einer klar machen, warum CSS-Styles besser sein sollen als Tabellen. Damit hätte ich das nämlich in 3 Minuten fertig.

mist, grad das hab ich nicht probiert, da es bei mir vorher nicht gefunzt hat..

tja, wieso soll man das benutzen? ka - angeben??

Nase
2003-10-20, 19:51:49
Naja, sag Bescheid wenns funktioniert hat. :)

MadMan2k
2003-10-20, 21:11:16
so, fertig:

http://mitglied.lycos.de/madman2k3/index.php?seite=guestbook

Nase
2003-10-20, 21:14:52
Scheint doch gut geklappt zu haben ;)

btw. ich bin auch gerade dabei, endlich mal ein vernünftiges Gästebuch zu proggen. Zufall? :D