CSS Problem

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • CSS Problem

    Hallo ich habe ein Problem und zwar ich habe eine Seite erstellt mit CSS Boxen. Aber das Problem ist das es nur im Mozilla angezeigt wird und nicht im IE wieso? Hier der Code.

    Quellcode

    1. body {
    2. font-family: Tahoma, Verdana;
    3. font-size: 12px;
    4. color: #000000;
    5. background: #BDE0FD;
    6. text-align: center;
    7. margin-left: 0px;
    8. margin-top: 0px;
    9. margin-right: 0px;
    10. margin-bottom: 0px;
    11. }
    12. td {
    13. font-family: Tahoma, Verdana;
    14. font-size: 12px;
    15. color: #000000;
    16. }
    17. img {
    18. border: 0px;
    19. }
    20. input, textarea, select {
    21. font-family: Tahoma, Verdana;
    22. font-size: 12px;
    23. border: 1px solid #000000;
    24. border-left: 2px solid #000000;
    25. background: #FFFFFF;
    26. color: #000000;
    27. padding-left: 3px;
    28. padding-right: 3px;
    29. }
    30. .ul {
    31. list-style: none;
    32. }
    33. .headerpic {
    34. width: 703px;
    35. height: 143px;
    36. text-align: center;
    37. padding-left: 0px;
    38. padding-right: 0px;
    39. padding-top: 0px;
    40. padding-bottom: 0px;
    41. background-image: url(img/header.jpg);
    42. }
    43. .nav {
    44. width: 703px;
    45. height: 26px;
    46. }
    47. .puffer {
    48. width: 695px;
    49. text-align: center;
    50. color:#000000;
    51. padding-left: 4px;
    52. padding-right: 4px;
    53. padding-top: 2px;
    54. padding-bottom: 2px;
    55. background-image: url(img/puffer.jpg);
    56. }
    57. .footer {
    58. width: 697px;
    59. height: 21px;
    60. text-align: center;
    61. color:#000000;
    62. padding-left: 3px;
    63. padding-right: 3px;
    64. padding-top: 5px;
    65. padding-bottom: 2px;
    66. background-image: url(img/footer.jpg);
    67. }
    68. a:link, a:active {
    69. color: #0099FF;
    70. text-decoration: none;
    71. }
    72. a:visited {
    73. text-decoration: none;
    74. color:#0033CC;
    75. }
    76. a:hover {
    77. color: #000000;
    78. }
    Alles anzeigen
    --Kommt noch--

  • versuch mal:

    Quellcode

    1. body {
    2. font-family: Tahoma, Verdana;
    3. font-size: 12px;
    4. color: #000000;
    5. background: #BDE0FD;
    6. text-align: center;
    7. margin-left: 0px;
    8. margin-top: 0px;
    9. margin-right: 0px;
    10. margin-bottom: 0px;
    11. }
    12. td {
    13. font-family: Tahoma, Verdana;
    14. font-size: 12px;
    15. color: #000000;
    16. }
    17. img {
    18. border: 0px;
    19. }
    20. input, textarea, select {
    21. font-family: Tahoma, Verdana;
    22. font-size: 12px;
    23. border: 1px solid #000000;
    24. border-left: 2px solid #000000;
    25. background: #FFFFFF;
    26. color: #000000;
    27. padding-left: 3px;
    28. padding-right: 3px;
    29. }
    30. #ul {
    31. list-style: none;
    32. }
    33. #headerpic {
    34. width: 703px;
    35. height: 143px;
    36. text-align: center;
    37. padding-left: 0px;
    38. padding-right: 0px;
    39. padding-top: 0px;
    40. padding-bottom: 0px;
    41. background-image: url(img/header.jpg);
    42. }
    43. #nav {
    44. width: 703px;
    45. height: 26px;
    46. }
    47. #puffer {
    48. width: 695px;
    49. text-align: center;
    50. color:#000000;
    51. padding-left: 4px;
    52. padding-right: 4px;
    53. padding-top: 2px;
    54. padding-bottom: 2px;
    55. background-image: url(img/puffer.jpg);
    56. }
    57. #footer {
    58. width: 697px;
    59. height: 21px;
    60. text-align: center;
    61. color:#000000;
    62. padding-left: 3px;
    63. padding-right: 3px;
    64. padding-top: 5px;
    65. padding-bottom: 2px;
    66. background-image: url(img/footer.jpg);
    67. }
    68. a:link, a:active {
    69. color: #0099FF;
    70. text-decoration: none;
    71. }
    72. a:visited {
    73. text-decoration: none;
    74. color:#0033CC;
    75. }
    76. a:hover {
    77. color: #000000;
    78. }
    Alles anzeigen

    und bau dazu noch float angaben ein, damit die boxen auch nich übereinander liegen:
    http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float


    nur so idee, aber poste doch auch mal den html code, wenns nicht funktioniert!
    Die Japaner glauben jetzt auch, sie könnten den Superrechner verkaufen. Das wäre
    so, als würde man einen Jumbo-Jet nehmen, vorne und hinten die Spitzen absägen,
    davon 10 Stück zusammenschweißen und als ultimativen Super-Jet verkaufen.

  • Quellcode

    1. <html>
    2. <head>
    3. <title></title>
    4. <link rel="stylesheet" type="text/css" href="style.css">
    5. <script language="JavaScript" type="text/JavaScript" src="javascript/hover.js">
    6. </head>
    7. <body onLoad="MM_preloadImages('img/2_nav_1.jpg','img/4_nav_1.jpg','img/5_nav_1.jpg','img/6_nav_1.jpg')">
    8. <div align="center">
    9. <ul class="ul">
    10. <li class="headerpic"></li>
    11. <li class="nav"><a href="?activ=home" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('1','','img/1_nav_1.jpg',0)"><img name="1" border="0" src="img/1_nav.jpg"></a><a href="?activ=lebenslauf" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('2','','img/2_nav_1.jpg',1)"><img name="2" border="0" src="img/2_nav.jpg"></a><a href="?activ=person" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('3','','img/3_nav_1.jpg',0)"><img name="3" border="0" src="img/3_nav.jpg"></a><a href="?activ=erfahrung" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('4','','img/4_nav_1.jpg',1)"><img name="4" border="0" src="img/4_nav.jpg"></a><a href="?activ=kontakt" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('5','','img/5_nav_1.jpg',1)"><img name="5" border="0" src="img/5_nav.jpg"></a><a href="?activ=impressum" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('6','','img/6_nav_1.jpg',1)"><img name="6" border="0" src="img/6_nav.jpg"></a></li>
    12. <li class="puffer"><?php if (!isset($_GET['activ'])) { $_GET['activ']="home"; } if (file_exists($_GET['activ'].".php")) { include($_GET['activ'].".php"); } else { echo "<b><center>Im moment ist diese Seite noch noch im Aufbau!</center></b> "; }?></li>
    13. <li class="footer"><?php include('datetime.php'); ?></li>
    14. </ul>
    15. </div>
    16. </body>
    Alles anzeigen
    --Kommt noch--

  • Also bei mri funktionierts so in beiden Browsern:

    Quellcode

    1. <html>
    2. <head>
    3. <title></title>
    4. <link rel="stylesheet" type="text/css" href="style.css">
    5. </head>
    6. <body onLoad="MM_preloadImages('img/2_nav_1.jpg','img/4_nav_1.jpg','img/5_nav_1.jpg','img/6_nav_1.jpg')">
    7. <div align="center">
    8. <ul class="ul">
    9. <li class="headerpic">bla</li>
    10. <li class="nav">bla</li>
    11. <li class="puffer">bla</li>
    12. <li class="footer">bla</li>
    13. </ul>
    14. </div>
    15. </body>
    Alles anzeigen


    Quellcode

    1. body {
    2. font-family: Tahoma, Verdana;
    3. font-size: 12px;
    4. color: #000000;
    5. background: #BDE0FD;
    6. text-align: center;
    7. margin-left: 0px;
    8. margin-top: 0px;
    9. margin-right: 0px;
    10. margin-bottom: 0px;
    11. }
    12. td {
    13. font-family: Tahoma, Verdana;
    14. font-size: 12px;
    15. color: #000000;
    16. }
    17. img {
    18. border: 0px;
    19. }
    20. input, textarea, select {
    21. font-family: Tahoma, Verdana;
    22. font-size: 12px;
    23. border: 1px solid #000000;
    24. border-left: 2px solid #000000;
    25. background: #FFFFFF;
    26. color: #000000;
    27. padding-left: 3px;
    28. padding-right: 3px;
    29. }
    30. .ul {
    31. list-style: none;
    32. }
    33. .headerpic {
    34. width: 703px;
    35. height: 143px;
    36. text-align: center;
    37. padding-left: 0px;
    38. padding-right: 0px;
    39. padding-top: 0px;
    40. padding-bottom: 0px;
    41. background-image: url(img/header.jpg);
    42. }
    43. .nav {
    44. width: 703px;
    45. height: 26px;
    46. }
    47. .puffer {
    48. width: 695px;
    49. text-align: center;
    50. color:#000000;
    51. padding-left: 4px;
    52. padding-right: 4px;
    53. padding-top: 2px;
    54. padding-bottom: 2px;
    55. background-image: url(img/puffer.jpg);
    56. }
    57. .footer {
    58. width: 697px;
    59. height: 21px;
    60. text-align: center;
    61. color:#000000;
    62. padding-left: 3px;
    63. padding-right: 3px;
    64. padding-top: 5px;
    65. padding-bottom: 2px;
    66. background-image: url(img/footer.jpg);
    67. }
    68. a:link, a:active {
    69. color: #0099FF;
    70. text-decoration: none;
    71. }
    72. a:visited {
    73. text-decoration: none;
    74. color:#0033CC;
    75. }
    76. a:hover {
    77. color: #000000;
    78. }
    Alles anzeigen


    Ist es ungefähr das, was du haben willst?
    Die Japaner glauben jetzt auch, sie könnten den Superrechner verkaufen. Das wäre
    so, als würde man einen Jumbo-Jet nehmen, vorne und hinten die Spitzen absägen,
    davon 10 Stück zusammenschweißen und als ultimativen Super-Jet verkaufen.

  • "GFXShorty" schrieb:

    Wieso was ist darin so schlimm donut?

    Das ist nur der Rollover, der so scheiße ist.


    schlimm hab ich doch gar nicht gesagt..

    hab mir den code gar nicht weiter angeschaut, aber du hast viele margins und paddings, und ich weiß dass IE und mozilla das leicht anders interpretieren..

    wenn du diese diese also aus der css entfernst und danach stück für stück wieder einbaust, dann wirst du den fehler schon finden