[CSS] Img in DIV unten positionieren

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [CSS] Img in DIV unten positionieren

    Möchte ein Bild ein einem Div unten Positionieren !

    html:
    Code:
    <div id="content">
      <div class="left_box">left</div>
      <div class="img_active">dasdasd</div>
      <div>all other</div>
    </div>
    css:
    Code:
    /*___ content ___*/
    #content {
    	background-image:url(../images/site/bg_content.gif);
    	background-repeat:no-repeat;
    	width:996px;
    	height:545px;
    }
    	#content .left_box {
    		width:86px;
    		float:left;
    		height:545px;
    	}
    	#content .img_active {
    		width:86px;
    		float:left;
    		vertical-align:bottom;
    		height:545px;
    		background-color:#0033CC;
    	}

    Leider ist das Bild(oder zum testen auch text) immer oben

    Wie gehts richtig ?
    thx Mukraker

  • #2
    background-position gibt's auch noch
    Ich denke, also bin ich. - Einige sind trotzdem...

    Kommentar


    • #3
      jo, ich wolltes es aber gerne auf den hintergrund legen!!!

      Außerdem kann man das bild so schnell per CMS ändern.
      thx Mukraker

      Kommentar


      • #4


        du meinst schon das bild, dass du per css in #content einbindest oder?
        Ich denke, also bin ich. - Einige sind trotzdem...

        Kommentar


        • #5
          das bild kommt in :

          Code:
           <div class="img_active"><img .......... ></div>
          thx Mukraker

          Kommentar


          • #6
            entweder du formatierst das bild selbst per css oder du gibst dem div padding
            Ich denke, also bin ich. - Einige sind trotzdem...

            Kommentar


            • #7
              padding muss ich je nach bildhöhe dann ja ändern !

              gibts keine andere möglichkeit, will ungerne auf das <img nen css legen!


              <div class="img_active"><img style="vertical-align:bottom" src="images/site/img_active_insnet.gif" width="86" height="256"></div>

              das geht nicht !!!
              thx Mukraker

              Kommentar


              • #8
                das padding bekommst du raus, da du in deinem cms ja irgendwie das neue bild hochladen musst, da kannst du ja gleich die höhe prüfen

                ansonsten versuche mal position:relative und bottom:0
                Ich denke, also bin ich. - Einige sind trotzdem...

                Kommentar


                • #9
                  Original geschrieben von mukraker
                  <div class="img_active"><img style="vertical-align:bottom" src="images/site/img_active_insnet.gif" width="86" height="256"></div>

                  das geht nicht !!!
                  natürlich nicht - weil du offenbar eine vollkommen falsche vorstellung von der wirkungsweise von vertical-align hast!
                  das ist an dieser stelle nicht brauchbar.


                  I don't believe in rebirth. Actually, I never did in my whole lives.

                  Kommentar


                  • #10
                    das bild ist von rubrik zu rubrik verschieden!
                    thx Mukraker

                    Kommentar


                    • #11
                      Original geschrieben von mukraker
                      das bild ist von rubrik zu rubrik verschieden!
                      und?

                      entweder das padding-top von php immer ausrechnen lassen oder mit position und bottom arbeiten

                      könntest eventuell auch vertical-align und display:inline kombinieren, aber selbst wenn es gehen sollte: schön ist das nicht
                      Ich denke, also bin ich. - Einige sind trotzdem...

                      Kommentar


                      • #12
                        ich machs nun einfach so, dass das bild nach oben hin transparent ist.

                        so sind alle bilder gleich groß und damit einheitlicher!
                        thx Mukraker

                        Kommentar

                        Lädt...
                        X