logo elektroda
logo elektroda
X
logo elektroda
REKLAMA
REKLAMA
Adblock/uBlockOrigin/AdGuard mogą powodować znikanie niektórych postów z powodu nowej reguły.

HTML/CSS - menu ucieka na bok i nie jest połączone z opisami

seventiseven 02 Gru 2014 18:04 846 0
REKLAMA
  • #1 14185605
    seventiseven
    Poziom 2  
    Posty: 3
    Witam
    mam problem otóż mam dość nietypowe menu, gdyż jest pod kątem i cała zabawa polega na tym, że przy podglądzie w firefoxie całe menu "ucieka" na lewą stronę, połowa elementów jest poza miejscem ustalonym, ale w projekcie czy podglądzie jest na swoim miejscu.
    Drugi problem polega na tym, że opisy typu np "kontakt", "Główna" itp w ogóle nie są "przyklejone do elementów czyli elementy swoje a opisy w innym miejscu.
    Jak poradzic sobie z obydwoma problemami?
    poniżej przykladowy schemat i kody.
    HTML/CSS - menu ucieka na bok i nie jest połączone z opisami
    #MENU {
    	
    	bottom: 435px;
    	right: 910px;
    	left: 230px;
    	top: 35px;
    	z-index: 0;
    }
    
    /*ZAWARTOSC MENU*/
    #MENU .ZAWARTOSC {
    	top: 35px;
    	right: 910px;
    	bottom: 435px;
    	left: 230px;
    	font-size: 16px;
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	z-index: 0;
    	color: #000000;
    }
    #MENU .ZAWARTOSC a:link {
    	color: #000000;
    	text-decoration: none;
    	font-weight: normal;
    	font-style: normal;
    }
    #MENU .ZAWARTOSC a:hover {
    	color: #000000;
    	text-decoration: none;
    	font-weight: 400;
    	font-style: normal;
    	text-align: justify;
    
    }
    #MENU .ZAWARTOSC ul {
    	display: block;
    	list-style-type: none;
    	margin: 0;
    	padding: 0;
    }
    #MENU .ZAWARTOSC ul li {
    	display: table-cell;
    	list-style-type: none;
    	margin: 0;
    	padding: 0;
    }
    
    #Image5 {
    	top: 290px;
    	bottom: 430px;
    	left: 240px;
    	right: 360px;
    	position:absolute;
    }
    
    #Image6 {
    		top: 255px;
    	bottom: 393px;
    	left: 445px;
    	right: 570px;
    position:absolute;
    }
    
    
    #Image7 {
    	top: 156px;
    	bottom: 295px;
    	left: 635px;
    	right: 770px;
    	position: absolute;
    }
    
    #Image8 {
    	top: 35px;
    	bottom: 170px;
    	left: 776px;
    	right: 910px;
    position:absolute;
    }


    <div id="MENU">
    			<!--MENU-->
    			<div class="MENU">
    				<div class="ZAWARTOSC">
    				<!--ZAWARTOSC MENU-->
    					<ul>
    					<li><img src="img/actywne.png" width="150" height="150" alt="" id="Image5"/><a href="">Główna</a></li>
    					<li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','img/nieactywne1.png',1)"><img src="img/nieactywne.png" alt="" width="auto" height="auto" id="Image6" /></a><a href="">O mnie</a></li>
    					<li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','img/nieactywne1.png',1)"><img src="img/nieactywne.png" alt="" width="auto" height="auto" id="Image7" /></a><a href="">Galeria</a></li>
    					<li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','img/nieactywne1.png',1)"><img src="img/nieactywne.png" alt="" width="auto" height="auto" id="Image8" /></a><a href="">Kontakt</a></li>
    					</ul>
    				<!--/ZAWARTOSC MENU-->
    				</div>
    			</div>
    			</div>
  • REKLAMA
REKLAMA