Visualizzazione dei risultati da 1 a 5 su 5
  1. #1

    Problema allineamento box

    Ciao a tutti,
    ho un problema strano che non riesco a risolvere.
    Guardate questo screenshot


    In teoria la parte rossa piana (.menuelement) con le scritte "Red", "Orange", etc dovrebbe combaciare con la strisca sopra (rossa con la sfumatura, #contenitore_menu) ma non capisco perché questo non succede e invece sbordi.
    Vi posto il codice:
    codice:
    #contenitore_menu{
    	clear:both;
    	float:right;
    	height:40px;
    	max-width:900px;
    	margin-top:10px;
    	border:#000000 1px solid;
    	background:url(../grafica/sfondi/menu.png) repeat-x;
    }
    	
    	.menuelement{
    		float: left;
    		display: block;
    		width: 117px;
    		height:40px;
    		border-left:#000000 1px solid;
    		background-color:#A00000;
    	}
    l'HTML
    codice:
      <div id="contenitore_menu">
        <ul id="menu">
          <li class="menuelement"><span>Red</span>
          <li class="menuelement"><span>Orange</span>
          <li class="menuelement"><span>Yellow</span>
          <li class="menuelement"><span>Green</span>
          <li class="menuelement"><span>Blue</span>
          <li class="menuelement"><span>Indigo</span>
          <li class="menuelement"><span>Violet</span>[/list]
      </div>
    spero qualcuno possa aiutarmi,
    grazie in anticipo ^^
    Flash Developer for Rich Media
    PHP, jQuery Developer

  2. #2
    A me viene bene con questo css:
    codice:
    #contenitore_menu{
    	clear:both;
    	float:right;
    	height:40px;
    	max-width:900px;
    	margin-top:10px;
    	border:#000000 1px solid;
    	background:url(../grafica/sfondi/menu.png) repeat-x;
    }
    ul#menu {
    margin: 0;
    padding: 0;
    }	
    ul#menu li.menuelement{
    		float: left;
    		display: block;
    		width: 117px;
    		height:40px;
    		border-left:#000000 1px solid;
    		background-color: green;
    	}

  3. #3
    si, alla fine c'ero arrivato anch'io
    il problema è che non mi ricordavo più che #menu fosse un UL ma ci ragionavo come fosse un div.... bah che rimbambito.

    Però cmq c'è un altro problema:
    #contenitore_menu è contenuto a sua volta da #seconda_riga
    che contiene anche la colonna bianca che vedete sotto e quella a fianco.
    codice:
    #seconda_riga{
    	clear:both;
    	margin-right:3%;
    }
    ora.... da quello che vedete sopra #contenitore_menu non ha width quindi in teoria dovrebbe adattarsi a tutta la larghezza di #seconda riga (ovvero arrivare a combaciare anche a sinistra con la colonna bianca).... ma questo non succede.
    Se provo a mettere width 100% #contenitore_menu mi sborda di qualcosa come 100px
    Non capisco perché ._____.

    qualcuno riesce ad aiutarmi anche per questo?
    Flash Developer for Rich Media
    PHP, jQuery Developer

  4. #4
    Non ho capito il problema...

  5. #5
    Non preoccuparti...
    sono riuscito a sistemare io, era un problema di parentela dei vari div e di percentuali....
    mi accorgo che dovevo essere fuso quando ho iniziato a fare sto foglio di stile... certe cose....

    va beh...

    Ovviamente però i problemi non finiscono mai....
    guardate che cosa strana mi succede adesso =__=


    Come vedete nella parte cerchiata, si sovrappongono due box:
    quello rosso e quello con la scritta "groviglio_back"

    posto il codice:
    HTML
    codice:
    <div id="contenitore_menumesi">
        <div id="menumesi">
          <div id="menumesi-bg">
            <div id="menumesi-bg-top">
              <div id="menumesi-bg-semi-bottom">sababa</div>
            </div>
          </div>
          <div id="menumesi-bg-bottom"></div>
        </div>
        <div id="groviglio_back">groviglio_back</div>
      </div>
    CSS
    codice:
    #contenitore_menumesi{
    	float:right;
    	width:30%;
    	max-width:300px;
    }
    
    	#menumesi{
    		height: 500px; /*test*/
    		border: #0033FF 1px solid;
    	}
    	
    		#menumesi-bg{
    			height:100%;
    			background:url(../grafica/sfondi/mesi-center.png) repeat-y right;
    		}
    		
    		#menumesi-bg-top{
    			height:100%;
    			background:url(../grafica/sfondi/mesi-top.png) no-repeat top right;
    		}
    		
    		#menumesi-bg-semi-bottom{
    			height:100%;
    			background:url(../grafica/sfondi/mesi-semi-bottom.png) no-repeat bottom right;
    		}
    		
    		#menumesi-bg-bottom{
    			background:url(../grafica/sfondi/mesi-bottom.png) no-repeat top right;
    			height:18px;
    		}
    
    #groviglio_back{
    	height: 200px;
    	border: #000000 solid 1px;
    }
    Da HTML #menumesi-bg-bottom dovrebbe essere contenuto in #menumesi però se vedete il bordo blu di #menumesi questo non arriva a racchiudere anche il bg-bottom... ed è quindi ovvio che #groviglio_back lo sovrasti... il problema è: PERCHé???

    spero di essermi spiegato =_=
    Flash Developer for Rich Media
    PHP, jQuery Developer

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.