XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Css Bug Verzweiflung (http://xhtmlforum.de/showthread.php?t=49843)

Hangman 14.01.2008 00:47

Css Bug Verzweiflung
 
Guten Morgen^^


ICh habe da mal so ein Problem, Was ich mir schon seit Tagen um die Ohren schlage. ICh habe einen Rahmen <div> um einen Countainer gelagt. Das geht auch Wunderbar. Nur Ist ein Darstellungs FEhler im Firefox.

Und Zwar,

Der Linke und Rechte RAnd hatt eine Preite von 9px also gebe ich im CSS

padding-left:9px; und padding-right:9px; an. Und das auf beiden Seiten. Nur habe ich das Problem wie Oben Gesagt das der Firefox das nur auf der Rechten seite padding-right:9px; Berücksichtigt aber nicht auf der Linken Seite. Da steht es etwar 1-2 Px über dem Rand. Also sozusagen Liegt die Innere Box auf dem Rahmengrafik LINKS. Dieser Bug ist aber weder im IE, noch im Opara. Nur der Firefox macht Muken:cry:

Kann mir Bitte jemant Sagen, wie man das Ausrichtet so das es im IE, FF ect Passt?... Hier mal eben noch der Code. der wird ja von Wichtig keit sein.


Code:

<table align="center" border="0" cellspacing="0" cellpadding="0" style="width:100%">
 <tr>
  <td><div class="obenlinks"></div></td>
  <td><div class="obenlinks2"></div></td>
  <td width="100%"><div class="obenmitte2"><div class="obenmitte"></div></div></td>
  <td><div class="obenrechts2"></div></td>
  <td><div class="obenrechts"></div></td>
 </tr>
</table>
<table align="center" border="0" cellspacing="0" cellpadding="0" style="width:100%">
 <tr>
  <td class="leiste_links"></td>
  <td>
<table width="100%">
 <tr>
  ##### inhalt #####
 </tr>
</table>
</td>
  <td class="leiste_rechts"></td>
 </tr>
</table>
<table align="center" border="0" cellspacing="0" cellpadding="0" style="width:100%">
 <tr>
  <td><div class="untenlinks"></div></td>
  <td><div class="untenlinks2"></div></td>
  <td width="100%" align="center"><div class="untenmitte"></div></td>
  <td><div class="untenrechts2"></div></td>
  <td><div class="untenrechts"></div></td>
 </tr>
</table>

## DIE CSS DAZU ##

.obenlinks {
    background: url("oben_links.jpg");
    background-repeat: no-repeat;
    background-position: bottom left;
    padding-left: 9px;
    height: 30px;
}
.obenlinks2 {
    background: url("oben_links2.jpg");
    background-repeat: no-repeat;
    background-position: bottom left;
    padding-left: 89px;
    height: 30px;
}
.obenmitte2 {
    background: url("oben_mitte2.jpg");
    background-repeat: repeat-x;
    background-position: bottom;
    height: 30px;
}
.obenmitte {
    background: url("oben_mitte.jpg");
    background-repeat: no-repeat;
    background-position: bottom;
    height: 30px;
}
.obenrechts2 {
    background: url("oben_rechts2.jpg");
    background-repeat: no-repeat;
    background-position: bottom right;
    padding-right: 112px;
    height: 30px;
}
.obenrechts {
    background: url("oben_rechts.jpg");
    background-repeat: no-repeat;
    background-position: bottom right;
    padding-right: 9px;
    height: 30px;
}
.untenlinks {
    background: url("unten_links.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    padding-left: 9px;
    height: 24px;
}
.untenlinks2 {
    background: url("unten_links2.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    padding-left: 89px;
    height: 24px;
}
.untenmitte {
    background:url("unten_mitte.jpg");
    background-repeat: repeat-x;
    background-position: top;
    height: 24px;
}
.untenrechts2 {
    background: url("unten_rechts2.jpg");
    background-repeat: no-repeat;
    background-position: top right;
    padding-right: 112px;
    height: 24px;
}
.untenrechts {
    background: url("unten_rechts.jpg");
    background-repeat: no-repeat;
    background-position: top right;
    padding-right: 9px;
    height: 24px;
}
.leiste_rechts {
  background: url("rand_rechts.jpg");
  background-repeat:repeat-y;
  background-position:top right;
  padding-right:9px;
}
.leiste_links {
  background: url("rand_links.jpg");
  background-repeat:repeat-y;
  background-position:top left;
  padding-left: 9px;
}

ICh weis nicht mehr weiter. Das ist der einziege Bug den ich habe und wäre Froh wenn man das beheben kann über eine weitere CSS Deklaration die es dann ausrichten. Bin ja leider kein Einstein... wäre abere mal was feines wenns so wäre ^^ Danke schon einmal für eure Hilfe:shock:


Mfg...Hangman

dottore:skin 14.01.2008 02:37

erm....
welchen <div> container um was gelegt ? solltest deine frage mal deutlicher stellen. ansonsten kann ich nur sagen les dich mal in html und css ein und schreibe ordentlichen code....

Hangman 14.01.2008 12:07

Mit <div> meinte ich den Rahmen Code der oben Gepostet ist. Plus die Css dazu.

Gesucht habe ich 3 Tage nach einer Erleuterung wie man es macht das alles Bündig sitzt. Was ist da jetzt nicht richtig Gefragt? Ich brauche ja nur einen CSS code der mir Zeigt, wie man Den Inhanlt bündig setzt. Wie gesagt der IE und Opara macht es ja nur der Firefox nicht. Und soviel wie ich schon Html und CSS gelesen habe kam ich Trotzdem nicht auf den grünen Zweig.

Einen Css und Div Code wie man einen Komplett umschlossenen Rahmen um einen Countainer legt habe ich auch nicht gefunden. Den eigentlich wollte ich das nich mit Tabellen in Kombination Div machen. Abwer was anderes viel mir leider nicht ein :lol:

Die Suche hier habe ich Genutzt, kam aber nichts dabei raus.


Mfg...Hangman

andir 14.01.2008 16:05

Kannst Du mal - vielleicht auf einem der vielen kostenlosen Webspaces, ein Beispiel posten? Deine Datei ist unvollständig und kann so nicht bearbeitet werden. Ferner ist mir nicht klar, welches div sich um welches andere Element legen soll.

Wofür brauchst Du die ganzen tables?

Hangman 14.01.2008 23:49

reicht ein screen vllt auch? da sieht man es ganz gut

hubspe 15.01.2008 07:04

Hi Hangman,

Zitat:

reicht ein screen vllt auch? da sieht man es ganz gut
Nein!

Gruß
Klaus


Alle Zeitangaben in WEZ +2. Es ist jetzt 11:56 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023