Ergebnis 1 bis 8 von 8

Thema: Zoom Problem in Google Chrome und Opera.

  1. #1
    HTML Newbie
    Registriert seit
    19.02.2016
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Lächeln Zoom Problem in Google Chrome und Opera.

    Hallo alle zusammen,

    Bin neu hier da ich mit meinem Latein am Ende bin, versuche ich mal ob mir hier die Profis helfen können.

    Habe einen Stil erstellt der folgender maßen aufgestellt ist.Siehe Code unten.
    Fehlerie Bilder Clices, haben einen Rahmen beim Zoomen mit Chrome und Opera.!!!!!!!!!!!!
    IE und Firefox ohne Fehler.

    Ich hoffe das Ihr mir Helfen könnt...irgenwas mach ich falsch...


    chrome.jpg
    W3C Valide ohne Fehler
    link zum Board: http://testboard4.my-pixel.eu/



    Ich versuche schon seit Tagen eine Lösung zu finden bin am Rande des Wahnsinns...

    Bitte helft mir ich dreh durch............

    HTML:


    HTML-Code:
    <div id="header"><div id="page">	<a id="top"></a>
    <table class="space"> <tr><td><div class="header_02"></div></td><td><div class="header_03"></div></td> </tr>     </table>
        <table class="space">        <tr>            <td>                <div class="header_06">                </div>            </td>
                <td>                <div class="header_07">                </div>            </td>        </tr>    </table>		
    <table class="space"> <tr><td><div class="header_08"></div></td><td><div class="header_09"></div></td><td><div class="header_10"></div></td></tr>     </table>
    <table class="space"> <tr><td><div class="header_11"></div></td><td><div class="header_12"></div></td> </tr>     </table>
    <table class="space"> <tr><td><div class="header_13"></div></td><td><div class="header_14"></div></td><td><div class="header_15"></div></td></tr>     </table>
    <table class="space"> <tr><td><div class="header_17"></div></td><td><div class="header_18"></div></td> </tr>     </table>
    <table class="space"> <tr>  <td class="leiste_links"></td>    <td class="main"> <div id="topmenu"></div>
    Css:

    Code:
    table.space {  border:0px;
      border-spacing: 0px 0px;
      }
    td {
      border:0px;
      }
    
    
    .tabularBoxTitle > header {
    padding: 6px 10px;
    background-image: url(@{style_image_path}tabular.jpg);
    border-bottom: 1px solid #AA4D00;
    }
    
    
    #header {
    min-width: 1046px; 
    max-width: 30%;
    height: 100%;
    background:    #e3e3e3;
    width: width 0px;
    margin: 0 auto;
    }
    
    
    
    
    
    
    .userPanel > div > .searchBar > form input[type="search"] {
    height: 30px;
    color: #000000;
    margin: 0px 0px;
    text-shadow: 0px -1px 0px transparent;
    width: 200px;
    border-radius: 0px;
    background-image: url(@{style_image_path}tabular.jpg);
    padding: 3px 10px 3px 24px;
    }
    
    
    .userPanel {
    height: 34px;
    padding-left:10px;
    padding-right: 10px;
    border-radius: 6px 6px 0px 0px;
    z-index: 200;
    position:relative;
    background-image: url(@{style_image_path}tabular.jpg);
    }
    
    
    .mainMenu {
    background-image: url(@{style_image_path}top_bg.jpg);
    border-top: 1px solid #AA4D00;
    }
    
    
    .mainMenu > ul > li > a {
    background-image: url(@{style_image_path}top_bg.jpg);
    border-right: 1px solid #AA4D00;
    box-shadow: 0px 0px 1px #AA4D00 inset;	
    
    
    }
    
    
    .navigationFooter {
    margin-top: -1px;
    background-image: url(@{style_image_path}tabular.jpg);
    border-top: 1px solid #AA4D00;
    border-bottom: 1px solid #171717;
    }
    
    
    
    
    Css-Bilder.......
    
    
     .header_02{
     background: url("../images/mp-autumn/header_02.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     width: 527px;
     height: 52px;
    
    
    }
    .header_03 {
     background: url("../images/mp-autumn/header_03.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 52px;
     width: 519px;
    
    
    }
    .header_06 {
     background: url("../images/mp-autumn/header_06.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     width: 528px;
     height: 72px;
    }
    
    
    .header_07 {
     background: url("../images/mp-autumn/header_07.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 72px;
     width: 518px;
    
    
    }
    .header_08 {
     background: url("../images/mp-autumn/header_08.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 99px;
     width: 258px;
    	
    
    
    
    
    }
    .header_09 {
     background: url("../images/mp-autumn/header_09.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 99px;
     width: 533px;
    	
    }
    .header_10 {
     background: url("../images/mp-autumn/header_10.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 99px;
     width: 255px;
    
    
    
    
    }
    
    
    .header_11 {
     background: url("../images/mp-autumn/header_11.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 85px;
     width: 529px;
    }
    
    
    .header_12 {
     background: url("../images/mp-autumn/header_12.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 85px;
     width: 517px;
    }
    .header_13 {
     background: url("../images/mp-autumn/header_13.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 33px;
     width: 181px;
    }
    .header_14 {
     background: url("../images/mp-autumn/header_14.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 33px;
     width: 704px;
    }
    .header_15 {
     background: url("../images/mp-autumn/header_15.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 33px;
     width: 161px;
    }
    .header_17 {
     background: url("../images/mp-autumn/header_17.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 31px;
     width: 532px;
    }
    
    
    .header_18 {
     background: url("../images/mp-autumn/header_18.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 31px;
     width: 514px;
    }
    .leiste_rechts {
     background: url("../images/mp-autumn/leiste_rechts.jpg");
     background-repeat: repeat-y;
     background-position: top right;
     width: 68px;
    }
    
    
    .leiste_links {
     background: url("../images/mp-autumn/leiste_links.jpg");
     background-repeat: repeat-y;
     background-position: top left;
     width: 69px;
    }
    
    
    
    
    
    
    
    
    .header_46 {
     background: url("../images/mp-autumn/header_46.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 78px;
     width: 525px;
    }
    
    
    
    
    .header_47 {
     background: url("../images/mp-autumn/header_47.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 78px;
     width: 521px;
    }
    
    
    .header_48 {
     background: url("../images/mp-autumn/header_48.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 20px;
     width: 452px;
    }
    
    
    .header_49 {
     background: url("../images/mp-autumn/header_49.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 20px;
     width: 140px;
    }
    
    
    .header_50 {
     background: url("../images/mp-autumn/header_50.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 20px;
     width: 454px;
    }
    
    
    .header_51 {
     background: url("../images/mp-autumn/header_51.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 26px;
     width: 441px;
    }
    
    
    .header_52 {
     background: url("../images/mp-autumn/header_52.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 26px;
     width: 176px;
    }
    
    
    .header_53 {
     background: url("../images/mp-autumn/header_53.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 26px;
     width: 429px;
    }
    
    
    .header_54 {
     background: url("../images/mp-autumn/header_54.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 51px;
     width: 549px;
    }
    
    
    .header_55 {
     background: url("../images/mp-autumn/header_55.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     margin: 0px auto; 
     padding: 0 0 0 0;
     height: 51px;
     width: 497px;
    }
    
    
    
    
    .obenmitte {
     background: url("../images/mp-autumn/obenmitte.jpg");
     background-repeat: repeat-x;
     background-position: bottom;
     height: 20px;
    }
    
    
    .obenlinks {
     background: url("../images/mp-autumn/obenlinks.jpg");
     background-repeat: no-repeat;
     background-position: bottom left;
     padding-left: 38px;
     height: 20px;
    }
    
    
    .obenrechts {
     background: url("../images/mp-autumn/obenrechts.jpg");
     background-repeat: no-repeat;
     background-position: bottom right;
     padding-right: 40px;
     height: 20px;
    }
    
    
    .untenrechts {
     background: url("../images/mp-autumn/untenrechts.jpg");
     background-repeat: no-repeat;
     background-position: top right;
     padding-right: 42px;
     height: 20px;
    }
    
    
    .untenlinks {
     background: url("../images/mp-autumn/untenlinks.jpg");
     background-repeat: no-repeat;
     background-position: top left;
     padding-left: 41px;
     height: 20px;
     margin: -7px auto 15px auto;
    }
    
    
    .untenmitte {
     background:url("../images/mp-autumn/untenmitte.jpg");
     background-repeat: repeat-x;
     background-position: top;
     height: 20px;
    }
    
    
    
    
    .obenlinks {
    margin: 10px auto -15px auto;
    }
    .untenmitte {
    margin: 6px auto -15px auto;
    }
    Vielen Dank für eure Hilfe
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Teeny
    Registriert seit
    15.09.2015
    Beiträge
    21
    Danke
    5
    Bekam 1 mal "Danke" in 1 Posting

    Standard AW: Zoom Problem in Google Chrome und Opera.

    Warum machst du denn alles mit Tabellen? Das ist doch Steinzeitmäßig?

    - - - Aktualisiert - - -

    Hast du border-collapse: collapse drin?

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    19.02.2016
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Zoom Problem in Google Chrome und Opera.

    HI

    Nein kein border-collapse..

    Steinzeit jo genau wie ich halt...lol
    kann es so aber halt auch nicht so Spitze...wie mann sehen kann.

    Du meinst alles über Css?
    Bin ich Parallel am Testen.

    Doch stellt sich mir die Frage mag ja veraltet sein, doch ist es deshalb Nicht realisierbar?
    oder gar nicht Richtig?

    Wenn es für mein Problem am Ende keine Lösung geben Sollte, dann müsste ich ja alles in Css machen, doch ob ich das noch in meine Birne bekomme ka...lol



    MFG

    Vielen Dank

    Geändert von Spider (20.02.2016 um 07:06 Uhr)

  4. #4
    Moderator Avatar von Arne Drews
    Registriert seit
    20.01.2016
    Ort
    Friedrichstadt, NF
    Beiträge
    1.234
    Danke
    21
    Bekam 120 mal "Danke" in 119 Postings

    Standard AW: Zoom Problem in Google Chrome und Opera.

    Hallo,

    Hast Du einen Link zu der Seite, da kann man das evtl. besser analysieren.

    Gruß Arne

  5. #5
    Interessierte/r Avatar von AnyKey
    Registriert seit
    31.01.2016
    Ort
    Raum Oldenburg / Bremen
    Beiträge
    107
    Danke
    16
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Zoom Problem in Google Chrome und Opera.

    Ja.

    Das HTML-Konstrukt macht es so nicht gerade übersichtlich und wartungsfreundlich.

    Übrigens arbeitest Du ja bereits schon mit CSS und das find ich ja schon mal .

    Für Layouts benötigt man heute keine Tabellen mehr. Die Div-Blöcke kannst Du auch so positionieren, wie Du sie haben willst.

    Es ist schwer es sich abzugewöhnen, wenn man sich erstmal jahrelang daran gewöhnt hat.

    Aber wenn Du die Idee mit dem tabellarischem Layout erst einmal über Bord geworfen hast, wirst Du es in Deinem Leben nicht wieder aufgreifen!


    Zur Frage:

    Welche Bilder sind denn genau betroffen?

    Also intuitiv würde ich sagen, dass es u.a. die Backgrounds von MainMenu sind, da Du denen auch einen Border zugewiesen hast.
    Drücken Sie die Any-Taste um fortzufahren!

  6. #6
    Großmeister(in)
    Registriert seit
    04.08.2009
    Beiträge
    567
    Danke
    0
    Bekam 66 mal "Danke" in 64 Postings

    Standard AW: Zoom Problem in Google Chrome und Opera.

    Hallo

    Hast Du einen Link zu der Seite, da kann man das evtl. besser analysieren.
    Hat er doch:

    http://testboard4.my-pixel.eu/

    doch ist es deshalb Nicht realisierbar?
    Nur realisierbar von Leuten, die sich mit der falschen Verwendung von Tabellen auskennen. Das sind aber nicht die Profis, die Tabellen halt nur korrekt anwenden.

    Du benötigst also Webseitenersteller, die ihrerseits Tabellen zum Layouten mißbrauchen und sich deshalb mit eigentlich unsinnigen Lösungen auskennen.

    Da Tabellen nur zum Anzeigen von Tabellendaten gedacht sind verhalten sie sich anders als andere Container. Wenn du für dein Problem eine Lösung suchst musst du also ein Spezialist in der falschen Anwendung vom Tabellenlayout werden. Und damit leben, dass dir deine eigentlich unsinnigen Lösungen bei Browserupdates jederzeit um die Ohren fliegen können. Die Browserersteller gehen schließlich von einer korrekten Anwendung von HTML und CSS aus. Ob das für dich wirklich Sinn macht?

    Wenn du bei deinem grafiklastigen Layout bleiben willst solltest du nur eine Grafik verwenden (dem silberfarbenen Bereich), den Farbverlauf im Hintergrund mittels CSS realisieren und die Inhalte per CSS auf der Grafik plazieren. Das ist viel einfacher zu realisieren und zugleich benutzerfreundlicher.

    Gruss

    MrMurphy
    Geändert von MrMurphy (20.02.2016 um 16:20 Uhr)

  7. #7
    Moderator Avatar von Arne Drews
    Registriert seit
    20.01.2016
    Ort
    Friedrichstadt, NF
    Beiträge
    1.234
    Danke
    21
    Bekam 120 mal "Danke" in 119 Postings

    Standard AW: Zoom Problem in Google Chrome und Opera.

    Zitat Zitat von MrMurphy
    Hat er doch:
    Upsi... Hab' ich gar nicht gesehen, sorry...

    Ok, @Spider:
    Wenn ich die Werte für die Breiten der Elemente anpasse sieht es auch im Chrome gut aus.
    Das ist aber, so wie es aufgebaut ist eher mühselig und fragwürdig, ob das über das ganze Dokument machbar ist.

    Wie bereits erwähnt, solltest Du Dich vom Tabellen-Layout trennen.
    Tabellen machen da Sinn, wo Du etwas tabellarisch anzeigen willst, bspw. eine Mitgliederliste o.ä.

    Für das Layouting sind die schon lange out.
    Du bekommst bessere Lösungen mit Containern und CSS.

    Gruß Arne

  8. #8
    HTML Newbie
    Themenstarter

    Registriert seit
    19.02.2016
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Zoom Problem in Google Chrome und Opera.

    Hi

    Dachte ich mir schon....
    Na da mach ich mich doch gleich mal ran...

    Vielen Dank

    Gruss

Ähnliche Themen

  1. Google Chrome Problem mit Slideshow
    Von hugo22 im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 28.02.2014, 22:56
  2. Floats gehen im Firefox/Opera, nicht in Safari/Chrome/IE
    Von hüttenliesl im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 01.03.2013, 16:37
  3. JS: In FF und Opera richtig, IE, Safari und Chrome falsch
    Von RedFighter im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 2
    Letzter Beitrag: 20.08.2009, 19:36
  4. Google Chrome aussperren
    Von Unregistriert im Forum Script-Archiv
    Antworten: 5
    Letzter Beitrag: 24.11.2008, 19:59
  5. Google Chrome
    Von minder im Forum Off Topic und Quasselbox
    Antworten: 49
    Letzter Beitrag: 20.09.2008, 00:20

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •