tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
5
ZUGRIFFE
396
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    berit berit ist offline Rookie
    Registriert seit
    Mar 2007
    Beiträge
    5
    hallo zusammen,

    ich baue gerade an meiner ersten website herum und habe ein problem. Ich habe bisher ein hintergrundbild und eine navigation bar und das sieht auch im browser alles klasse aus..., aber dann habe ich noch im unteren balken 3 Links. Die Navigation bar und die links sind in tables gebaut. Das problem ist nun, dass die 3 Links im browser immer viel weiter unten sind als in der ansicht in dreamweaver. ich finde den fehler einfach nicht...
    mein code sieht folgendermaßen aus:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    
    <td><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25
              " height="1" /></p>
                <p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="1" height="0" /></p></td>
              <td>&nbsp;</td>
              <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('terms','','images/buttons/terms_down_26.jpg',1)"><img src="http://www.tutorials.de/forum/images/buttons/terms_26.jpg" alt="terms of use" name="terms" width="79" height="19" border="0" id="terms" onclick="MM_openBrWindow('http://www.universalpictures.com/legal/index.html','TermsOfUse','')" /></a></td>
            </tr>
            <tr>
              <td><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25" height="1" /></p>            </td>
              <td>&nbsp;</td>
              <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('privacy','','images/buttons/privacy_down_22.jpg',1)"><img src="http://www.tutorials.de/forum/images/buttons/privacy_22.jpg" alt="Privacy Policy" name="privacy" width="87" height="19" border="0" id="privacy" onclick="MM_openBrWindow('http://www.universalpictures.com/legal/privacy.html','PrivacyPolicy','')" /></a></td>
            </tr>
            <tr>
              <td><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25" height="1" /></p>            </td>
              <td>&nbsp;</td>
              <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('feedback','','images/buttons/feedback_down_29.jpg',1)"><img src="http://www.tutorials.de/forum/images/buttons/feeback_29.jpg" alt="Feedback" name="feedback" width="60" height="19" border="0" id="feedback" onclick="MM_openBrWindow('http://www.universalstudios.com/homepage/html/contact_us/contact_form.cgi?email_id=9','Feedback','')" /></a></td>
            </tr>
            <tr>
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    kannst du mal zum Vergleich zwei Screenshots (Browser vs. Dreamweaver) anhängen und den übrigen Quellcode der Tabellenstruktur posten, damit man einen Anhaltspunkt hat?

    Und bitte achte in deinen Beiträgen auf eine durchgängige Groß- und Kleinschreibung, siehe Netiquette #15. Vielen Dank!
     

  3. #3
    berit berit ist offline Rookie
    Registriert seit
    Mar 2007
    Beiträge
    5
    Anbei der übrige Quellcode meiner Tabellenstruktur:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    
    <body class="body" onload="MM_preloadImages('images/buttons/story_down.jpg','images/buttons/story_over.jpg','images/buttons/behind_down_07.jpg','images/buttons/behind_over_07.jpg','images/buttons/cast_down_11.jpg','images/buttons/cast_over_11.jpg','images/buttons/audio_down_15.jpg','images/buttons/audio_over_15.jpg','images/buttons/links_down_18.jpg','images/buttons/links_over_18.jpg','images/buttons/terms_down_26.jpg','images/buttons/privacy_down_22.jpg','images/buttons/feedback_down_29.jpg')">
    <div class="bg_layer" id="Layer1"></div>
    <table width="841" border="0" align="center" cellpadding="0" cellspacing="0" class="bg">
      <tr>
        <td style="text-align:center"><div class="bg">
          <table width="841" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td width="741" height="107"><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="1" height="0" /></p>
                <p>&nbsp;</p></td>
              <td width="10">&nbsp;</td>
              <td width="90">&nbsp;</td>
            </tr>
            <tr>
              <td height="431"><table width="176" height="400" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td height="61"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','group1','story','images/buttons/story_down.jpg',1)" onmouseover="MM_nbGroup('over','story','images/buttons/story_over.jpg','images/buttons/story_down.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="http://www.tutorials.de/forum/images/buttons/story.jpg" alt="Story" name="story" width="80" height="45" border="0" id="story" onload="" /></a></td>
                  </tr>
                  <tr>
                    <td height="95"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','group1','behind_the_scenes','images/buttons/behind_down_07.jpg',1)" onmouseover="MM_nbGroup('over','behind_the_scenes','images/buttons/behind_over_07.jpg','images/buttons/behind_down_07.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="http://www.tutorials.de/forum/images/buttons/behind_07.jpg" alt="Behind the scenes" name="behind_the_scenes" width="140" height="62" border="0" id="behind_the_scenes" onload="" /></a></td>
                  </tr>
                  <tr>
                    <td height="82"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','group1','Cast_Crew','images/buttons/cast_down_11.jpg',1)" onmouseover="MM_nbGroup('over','Cast_Crew','images/buttons/cast_over_11.jpg','images/buttons/cast_down_11.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="http://www.tutorials.de/forum/images/buttons/cast_11.jpg" alt="Cast + Crew" name="Cast_Crew" width="98" height="61" border="0" id="Cast_Crew" onload="" /></a></td>
                  </tr>
                  <tr>
                    <td height="86"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','group1','audio_video','images/buttons/audio_down_15.jpg',1)" onmouseover="MM_nbGroup('over','audio_video','images/buttons/audio_over_15.jpg','images/buttons/audio_down_15.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="http://www.tutorials.de/forum/images/buttons/audio_15.jpg" alt="" name="audio_video" width="105" height="57" border="0" id="audio_video" onload="" /></a></td>
                  </tr>
                  <tr>
                    <td height="60"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','group1','links','images/buttons/links_down_18.jpg',1)" onmouseover="MM_nbGroup('over','links','images/buttons/links_over_18.jpg','images/buttons/links_down_18.jpg',1)" onmouseout="MM_nbGroup('out')"><img src="http://www.tutorials.de/forum/images/buttons/links_button.jpg" alt="Links" name="links" width="85" height="42" border="0" id="links" onload="" /></a></td>
                  </tr>
                </table>
                <p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="1" height="0" /></p></td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25
              " height="1" /></p>
                <p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="1" height="0" /></p></td>
              <td>&nbsp;</td>
              <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('terms','','images/buttons/terms_down_26.jpg',1)"><img src="http://www.tutorials.de/forum/images/buttons/terms_26.jpg" alt="terms of use" name="terms" width="79" height="19" border="0" id="terms" onclick="MM_openBrWindow('http://www.universalpictures.com/legal/index.html','TermsOfUse','')" /></a></td>
            </tr>
            <tr>
              <td><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25" height="1" /></p>            </td>
              <td>&nbsp;</td>
              <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('privacy','','images/buttons/privacy_down_22.jpg',1)"><img src="http://www.tutorials.de/forum/images/buttons/privacy_22.jpg" alt="Privacy Policy" name="privacy" width="87" height="19" border="0" id="privacy" onclick="MM_openBrWindow('http://www.universalpictures.com/legal/privacy.html','PrivacyPolicy','')" /></a></td>
            </tr>
            <tr>
              <td><p><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25" height="1" /></p>            </td>
              <td>&nbsp;</td>
              <td><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('feedback','','images/buttons/feedback_down_29.jpg',1)"><img src="http://www.tutorials.de/forum/images/buttons/feeback_29.jpg" alt="Feedback" name="feedback" width="60" height="19" border="0" id="feedback" onclick="MM_openBrWindow('http://www.universalstudios.com/homepage/html/contact_us/contact_form.cgi?email_id=9','Feedback','')" /></a></td>
            </tr>
            <tr>
              <td><img src="http://www.tutorials.de/forum/images/spacer.gif" width="25" height="1" /></td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td><img src="http://www.tutorials.de/forum/images/spacer.gif" width="1" height="0" /></td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
          </table>
        </div>
    </td>
      </tr>
    </table>
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken positionierung des tables-ansicht-im-browser.jpg   positionierung des tables-ansicht-dw.jpg  

     

  4. #4
    Maik Tutorials.de Gastzugang
    Bei mir werden die drei Grafik-Links in allen mir zur Verfügung stehenden Browsern innerhalb der Tabelle angezeigt.

    Wie lautet denn das Stylesheet für die Klasse .bg?
     

  5. #5
    berit berit ist offline Rookie
    Registriert seit
    Mar 2007
    Beiträge
    5
    Ich weiß leider gerade nicht genau, welche class du wissen wolltest, deshalb habe ich nun alle aus dem Code copiert. Hoffe du findest so das Problem.

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    
    .bg {
    z-index:1;
    background-image:url(images/bg.png);
    background-repeat:no-repeat;
    height: 600px;
    width: 841px;
    }
     
    .buttonstory {
    position:absolute;
        left:auto;
        top:auto;
        width:106px;
        height:79px;
        z-index:2;
    }
    #Layer1 {
        position:absolute;
        left:274px;
        top:144px;
        width:628px;
        height:350px;
        z-index:1;
    }
    .bg_layer {
        font-family: Arial, Verdana, "Times New Roman";
        font-size: 11px;
        font-style: normal;
        color: #FFFFFF;
        text-decoration: none;
        background-attachment: fixed;
        background-color: #333333;
        background-repeat: repeat;
        letter-spacing: normal;
        text-align: left;
        word-spacing: normal;
    }
     

  6. #6
    Maik Tutorials.de Gastzugang
    Hi,

    ich kann da noch immer kein "Überlappen" der drei Grafik-Links auf der rechten Seite feststellen - siehe angehängten Screenshot.

    Ansonsten versuch es mal mit den folgenden Stylesheet-Ergänzungen:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    
    img {
    display: block;
    }
     
    p {
    margin: 0;
    padding: 0;
    }
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken positionierung des tables-demo_berit.jpg  
     

Ähnliche Themen

  1. HTML Tables
    Von iFlyPlanes im Forum HTML & XHTML
    Antworten: 3
    Letzter Beitrag: 12.10.09, 15:05
  2. EIT Tables
    Von EIT-Tables im Forum Videoschnitt, Videotechnik & -produktion
    Antworten: 2
    Letzter Beitrag: 14.12.07, 13:25
  3. div tables und der IE
    Von PHlL im Forum CSS
    Antworten: 19
    Letzter Beitrag: 01.11.07, 19:25
  4. tables verbinden
    Von Stephan Zesiger im Forum Relationale Datenbanksysteme
    Antworten: 2
    Letzter Beitrag: 12.02.03, 21:23
  5. Wie mal die Tables...
    Von Naj-Zero im Forum HTML & XHTML
    Antworten: 3
    Letzter Beitrag: 14.05.02, 13:44