[CSS] background-image außerhalt von container noch anzeigen

Dieses Thema im Forum "Webdesign" wurde erstellt von onip, 20. Oktober 2009 .

Schlagworte:
Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 20. Oktober 2009
    Zuletzt von einem Moderator bearbeitet: 15. April 2017
    background-image außerhalt von container noch anzeigen

    hi,

    vielleicht hat jemand eine gut idee für dieses problem.

    hier mal ein bild
    previewaj.gif
    {img-src: //img195.imageshack.us/img195/7494/previewaj.gif}


    html kann so
    HTML:
    <h1>Lorem ipsum dolor sit amet</h1>
<p>consectetur adipiscing elit. Quisque fermentum, nisi vitae convallis iaculis, magna justo aliquam massa, a porta tellus sapien sed neque. Nulla sit amet lorem eget quam euismod hendrerit?</p>
    oder mal so vorkommen
    HTML:
    <h1>Lorem ipsum dolor sit amet</h1>
consectetur adipiscing elit. Quisque fermentum, nisi vitae convallis iaculis, magna justo aliquam massa, a porta tellus sapien sed neque. Nulla sit amet lorem eget quam euismod hendrerit?
    habs so versucht
    HTML:
    <style>
h1 {
 color: #a6af08;
 font-size: 1.2em;
 padding: 18px 0 18px 0;
 background: transparent url(../img/arrow_h1.gif) -10px 50px no-repeat;
}
</style>
<h1>Lorem ipsum dolor sit amet</h1>
    nur leider wird das bild abgeschnitten, da es aus dem container (h1) verschoben wird.

    weiß jemand wie man bilder auch außerhab vom container noch darstellen kann?
     
  3. 20. Oktober 2009
    AW: background-image außerhalt von container noch anzeigen

    Deinem Div den Hintergrund zuweisen. Diesem Div ein Padding links geben (Bsp. 25px), danach noch ein negatives Margin links (Bsp. -25px). So könnte das klappen. Habs jetzt aber nicht getestet.
     
  4. 21. Oktober 2009
    AW: background-image außerhalt von container noch anzeigen

    Negatives Margin ist im IE-6 soweit ich weiß nicht möglich.
    Alternativ kannst du, je nachdem, ob du automatisch breite hast, position: relative und left: -25px machen.
    Weitere Alternative ist das Div relative zu positionieren und den Pfeil als absolutes img anzuzeigen.
     
  5. 21. Oktober 2009
    AW: background-image außerhalt von container noch anzeigen

    habs
    HTML:
    h1 {
 padding: 18px 0 38px 12px;
 margin: 0 0 -18px -12px;
 background: transparent url(../img/arrow_h1.gif) 0 bottom no-repeat;
}
    läuft auch auf ie6
     
  6. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.