tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
4
ZUGRIFFE
490
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    aleks aleks ist offline Mitglied Silber
    Registriert seit
    Apr 2004
    Ort
    Dortmund
    Beiträge
    98
    Hallo Leute,
    nach langer Zeit habe ich mich wieder einmal mit CSS beschäftigt.
    Ich habe ein Problem mit der Vererbung der Klasse "unterteilung". Diese soll, wenn Sie angegeben wird, aus einem rosa Hintergrund(in der Klasse right) einen anderen machen. Bloß passiert das hier nicht. Das Tag (h3) übernimmt nichts aus der Klasse div.right div.unterteilung h3. Ich bin am ende meines Wissens. Hab Ihr vielleicht einen Tipp, wie ich den Code ändern sollte? Danke schon mal.
    Hier die Code:
    HTML-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    	
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    	<title></title>
    	<link rel="stylesheet" media="all" type="text/css" href="css/css2.css" />
    </head>
    
    <body>
    <!-- ****banner content*********************************************************************************-->
    <div id="banner" ><img src="img/monorom_css_logo.gif" alt="" width="414" height="56" border="0" /></div>
    <!--******************************************beginn container****************************************-->
    <div id="container">
    
     		<h1>service for a better code</h1>
    	
    
    
    <!-- **************************************************************beginn Side left*******************-->
    <div id="left"></div>
    <!--**************************************************beginn Side right*******************************-->
    <div class="right">
    <h3 class="right unterteilung">blabla</h3>
    </div>
    <!-- ************************************************beginn content**********************************-->
    <div id="content"></div>
    <!-- ******************************************************beginn footer*****************************-->
    <div id="#footer"><h1>in valid code we trust (*^_^*) miss monorom</h1></div>
    </div> <!-- *******************************************************end of container*****************-->
    
    </body>
    </html>
    und CSS:
    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
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    
    body {
    background-color: #e1ddd9;
    font-size: 11px;
    font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
    color:#564b47;
    padding:0;
    margin:0;
    }
    a {color: #DB7093;}
    a:visited {color:#DB7093;}
    a:hover {color: #564b47;}
    a:active { color:#000000;}
     
    h1 {
    font-size: 11px;
    text-transform:uppercase;
    background-color: #E0A3B7;
    border-top:1px solid #564b47;
    border-bottom:1px solid #564b47;
    padding:5px 15px;
    margin:0 }
     
    h2 {
    font-size:20px;
    font-weight: normal;
    padding: 5px 10px;
    margin:0px;}
     
    img.download {vertical-align:middle;}
     
    /* ----------container zentriert das layout-------------- */
    #container {
    width: 900px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    background-color: #EBD3E0;
    }
     
    /* ----------banner for logo-------------- */
    #banner {
    background-color: #e1ddd9;
    text-align: right;
    padding: 0px;
    margin: 0px;
    }
    #banner img {padding:10px 0px;} 
     
    /* -----------------Inhalt--------------------- */
    #content {
    background-color: #ffffff;
    padding: 0;
    margin: 0 200px;
    }
    div#content { 
    min-height:600px;
    height:expression(this.scrollHeight > 600 ? "auto":"600px"); 
    }
     
    p, pre{
    padding: 5px 10px;
    margin:0;
    }
     
    /* --------------left navigavtion------------- */
    #left {
    float: left;
    width: 200px;
    margin: 0px;
    padding: 0px;
    }
    .right {
        float: right;
        width: 200px;
        margin: 0;
        padding: 0;}
     
    [B].unterteilung{
        margin: 0;
        padding: 0;
        width: 200px;
        height: 2em;
    }
    div.right div.unterteilung h3
    {
        
     
     
        
        background-color: #D6BF86;
        
    }[/B]
    /* -----------footer--------------------------- */
    #footer {
    clear: both;
    margin: 0px;
    padding: 0px;
    text-align: right; }

    Gruß
    aleks
    Geändert von aleks (26.07.09 um 03:19 Uhr)
     

  2. #2
    Avatar von Loomis
    Loomis Loomis ist offline Mitglied Bunt
    Registriert seit
    Jul 2002
    Ort
    Aschaffenburg
    Beiträge
    1.538
    Hi,

    Code :
    1
    2
    3
    4
    
    div.right div.unterteilung h3
    {
        background: #D6BF86;
    }

    Schreib das mal so:
    Code :
    1
    2
    3
    4
    
    .right, .unterteilung, h3
    {
        background: #D6BF86;
    }
     
    mfg
    --------------------------------------------------------------------------------
    Kein Support via PN, Email, ICQ, Brieftaube oder Flaschenpost!

    Besucht den tutorials.de-Chat | Anleitung
    RTFM - PHP-Handbuch - MySql Handbuch
    --------------------------------------------------------------------------------
    Surftipp...Der Postillon
    --------------------------------------------------------------------------------
    Signatur v2.2

  3. #3
    aleks aleks ist offline Mitglied Silber
    Registriert seit
    Apr 2004
    Ort
    Dortmund
    Beiträge
    98
    Danke hat geklappt!
    Ich hätte da noch eine Frage: Was muss man den ändern, wenn ich statt „h3“ „h1“ schreibe (welches ja schon allgemeine Definition hat) Ziel ist es h1{} zu übertreiben durch die Definition in „unterteilung{}“ und die Verbindung von „unterteilung“ und „h1“. Wenn ich deine Vorgabe für „h1“ übernehme, wird trotzdem „h1{}“ angewand! Wie würde das denn aussehen. Will ja nur das Prinzip verstehen. Danke.

    Gruß
    aleks
     

  4. #4
    Quaese Quaese ist offline Moderator
    tutorials.de Moderator
    Registriert seit
    Feb 2004
    Beiträge
    3.451
    Hi,

    wenn es nur Elemente betreffen soll, die im Container mir der Klasse right enthalten sind, ist folgender Selektor richtig.
    Code :
    1
    2
    3
    4
    
    .right .unterteilung
    {
        background-color: #D6BF86;
    }

    Damit sollten auch H1-Überschriften abgedeckt sein.

    Ciao
    Quaese
     
    Vielleicht muss man manchmal vom Weg abkommen, um nicht auf der Strecke zu bleiben!
    ----
    Der "Fortsetzungsroman" auf www.leuteforum.de

    New kind to realize large scalable projects with jQuery: jQuery SDK

  5. #5
    aleks aleks ist offline Mitglied Silber
    Registriert seit
    Apr 2004
    Ort
    Dortmund
    Beiträge
    98
    Danke hat geklappt.
    Jetzt habe ich noch ein Problem mit Positionierung einer Trennlinie: Firefox zeigt die Linie an der richtigen Stelle, der IE versetzt sie um einiges mehr nach links. Also kann mir jemand helfen, damit die Position der Trennlinie in beiden Browsern gleich ist. Danke. Hier sind die relevanten Codeteile:
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    
    hr
    {
         width:180px; position: absolute; left:775px;top:133px; 
         
         
        background-color: #FFFFFF; /* Farbe für Opera und Firefox */ 
    color: #FFFFFF; /* Farbe für Internet Explorer (IE) */
    border: 0; 
    height: 1px; 
    display: block
     
    }
    HTML-Code:
    <div id="banner" ><a href="#" border="0"><img src="file:///C|/Dokumente%20und%20Einstellungen/Aleksandr/Eigene%20Dateien/logo.gif" border="0"></a><p style="text-align:right; color: #ffffff;text-decoration:none;";"><a href="#">Ihr Konto</a> |<a href="#">Warenkorb</a>| <a href="#">Kasse</a></p><hr 
    />
     		<h1><a href="#" name="#" style="color: #ffffff;text-decoration:none;">Startseite></a> <a href="#" name="#"style="color: #ffffff;text-decoration:none;">Katalog</a></h1>
    	</div>
    	<div class="left">
    Gruß
    aleks
     

Ähnliche Themen

  1. Problem mit Konstruktoren und Vererbung
    Von Lautsprecher im Forum C/C++
    Antworten: 2
    Letzter Beitrag: 23.01.10, 16:22
  2. Problem bei Vererbung
    Von javainselhopper im Forum Java Grundlagen
    Antworten: 3
    Letzter Beitrag: 21.05.08, 10:20
  3. [c++] Polymorphie - Problem Vererbung
    Von radazong im Forum C/C++
    Antworten: 4
    Letzter Beitrag: 17.01.08, 02:05
  4. JAXB (Java2XML) -> Problem mit Vererbung
    Von denyo85 im Forum Java
    Antworten: 1
    Letzter Beitrag: 24.08.07, 10:07
  5. Vererbung - Problem
    Von CodeFatal im Forum VisualStudio & MFC
    Antworten: 3
    Letzter Beitrag: 24.10.06, 19:43

Stichworte