Auf Thema antworten 2026

Beitrag

<blockquote data-quote="black-hat" data-source="post: 2478286" data-attributes="member: 311877">Liebe Forumgemeinde. Ich habe ein Problem bezüglich der CSS3 Funktion: calc()Wie hier im Screen zu sehen ist, berechnet z.B. der Firefox den Inhalt der Funktion falsch. <a href="http://abload.de/image.php?img=pagetitle-mozillafireh0u1q.jpg" target="_blank"><img src="http://abload.de/thumb/pagetitle-mozillafireh0u1q.jpg" alt="" class="fr-fic fr-dii fr-draggable " data-size="" style="" /></a>Im CSS sieht&#039;s anders aus:header{&nbsp;&nbsp; &nbsp; display: block;&nbsp; width: 100%;&nbsp; height: 130px;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp; img[src*=&quot;logo&quot;]&nbsp; {&nbsp; width: 130px;&nbsp; float: left;&nbsp; margin-right: 50px;&nbsp; }&nbsp;&nbsp; &nbsp; div#search&nbsp; {&nbsp; float: left;&nbsp; border: 3px solid #0054bb;&nbsp; padding: 10px;&nbsp; width: -moz-calc(100% - 160px);&nbsp; width: -webkit-calc(100% - 160px);&nbsp; width: calc(100% - 160px);&nbsp; display: block;&nbsp;&nbsp; &nbsp;&nbsp; &nbsp; img&nbsp; {&nbsp; float: left;&nbsp; margin-right: 5px;&nbsp; }&nbsp; input[type=&quot;text&quot;]&nbsp; {&nbsp; width: 500px;&nbsp; height: 27px;&nbsp; padding-left: 5px;&nbsp; }&nbsp;&nbsp; &nbsp; input[type=&quot;submit&quot;]&nbsp; {&nbsp; width: 100px;&nbsp; height: 31px;&nbsp; border : solid 0px;&nbsp; border-radius : 5px;&nbsp; moz-border-radius : 5px;&nbsp; color : #ffffff;&nbsp; padding : 1px 17px;&nbsp; background-color : #089f00;&nbsp; }&nbsp;&nbsp; &nbsp; select[name=&quot;kategorie&quot;]&nbsp; {&nbsp; height: 31px;&nbsp; }&nbsp;&nbsp; &nbsp; img&nbsp; {}&nbsp; }}(Ich benutze .less - also nicht wundern wegen der verschachtelung...)Wo ist mein Fehler? Ich bin noch Hinweisen nachgegangen wie <a href="http://jsfiddle.net/UF3mb/10/" target="_blank">http://jsfiddle.net/UF3mb/10/</a> oder <a href="http://hacks.mozilla.org/2010/06/css3-calc/" target="_blank">http://hacks.mozilla.org/2010/06/css3-calc/</a>. Es hat nur leider mein Problem nicht gelöst. Auch ein Lösungsweg mit einer absoluten positionierung habe ich ausprobiert, doch ich glaube, dass es auch anders geht.</blockquote>

[QUOTE="black-hat, post: 2478286, member: 311877"] Liebe Forumgemeinde. Ich habe ein Problem bezüglich der CSS3 Funktion: calc() Wie hier im Screen zu sehen ist, berechnet z.B. der Firefox den Inhalt der Funktion falsch. [url=http://abload.de/image.php?img=pagetitle-mozillafireh0u1q.jpg][img]http://abload.de/thumb/pagetitle-mozillafireh0u1q.jpg[/img][/url] Im CSS sieht's anders aus: header{ display: block; width: 100%; height: 130px; img[src*="logo"] { width: 130px; float: left; margin-right: 50px; } [COLOR=#a6ff4d] div#search { float: left; border: 3px solid #0054bb; padding: 10px; width: -moz-calc(100% - 160px); width: -webkit-calc(100% - 160px); width: calc(100% - 160px); display: block;[/COLOR] img { float: left; margin-right: 5px; } input[type="text"] { width: 500px; height: 27px; padding-left: 5px; } input[type="submit"] { width: 100px; height: 31px; border : solid 0px; border-radius : 5px; moz-border-radius : 5px; color : #ffffff; padding : 1px 17px; background-color : #089f00; } select[name="kategorie"] { height: 31px; } img {} } } (Ich benutze .less - also nicht wundern wegen der verschachtelung...) Wo ist mein Fehler? Ich bin noch Hinweisen nachgegangen wie [url]http://jsfiddle.net/UF3mb/10/[/url] oder [url]http://hacks.mozilla.org/2010/06/css3-calc/[/url]. Es hat nur leider mein Problem nicht gelöst. Auch ein Lösungsweg mit einer absoluten positionierung habe ich ausprobiert, doch ich glaube, dass es auch anders geht. [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 7, ▼ = 3, ◇ = 2 und die Summe von ▲ und ▼ durch ◇ geteilt wird, was ist das Ergebnis?