Pereiti prie turinio

xHTML / CSS pagalba.


Rekomenduojami pranešimai

Labdiena,

Klausimas: Reikia padaryti kad footerį lygiuotų BOTTOM ir būtų pagal webo plotį, ta prasme standartas toks koks yra, o jeigu reikia plėsti, jis vis prasiplečia, tačiau lygiuoja bottom.

 

index.html:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="style.css" rel="stylesheet" type="text/css" />

<script language="javascript" type="text/javascript">
function swapImage(imgN,imgU){
if(document.images)document.images[imgN].src=imgU;
}
</script>

</head>

<body>
<div id="conteiner"><!-- SIZE 890px -->
<div class="div_proceduros"><!-- SIZE 290px -->
	<div class="div_logo_flash">
		<div class="div_logo">
			FLASHSA
		</div>
	</div>
	<div id="proceduros">Proceduros</div>
</div>

<div class="div_content"><!-- SIZE 600px -->
	<div id="div_menu">
		<div style="padding-top: 25px;" id="menu">
		  <a href="#" onmouseover="swapImage( 'image1' , 'image/z_f.png' )" onmouseout="swapImage( 'image1' , 'image/z_e.png' )"><img src="image/z_e.png" border="0" alt="spa" width="18" height="18" name="image1"/> Apie mus</a><span>   </span>

		  <a href="#" onmouseover="swapImage( 'image2' , 'image/z_f.png' )" onmouseout="swapImage( 'image2' , 'image/z_e.png' )"><img src="image/z_e.png" border="0" alt="spa" width="18" height="18" name="image2"/> Paslaugos</a><span>   </span>

		  <a href="#" onmouseover="swapImage( 'image3' , 'image/z_f.png' )" onmouseout="swapImage( 'image3' , 'image/z_e.png' )"><img src="image/z_e.png" border="0" alt="spa" width="18" height="18" name="image3"/> Galerija</a><span>   </span>

		  <a href="#" onmouseover="swapImage( 'image4' , 'image/z_f.png' )" onmouseout="swapImage( 'image4' , 'image/z_e.png' )"><img src="image/z_e.png" border="0" alt="spa" width="18" height="18" name="image4"/> Naujienos</a><span>   </span>

		  <a href="#" onmouseover="swapImage( 'image5' , 'image/z_f.png' )" onmouseout="swapImage( 'image5' , 'image/z_e.png' )"><img src="image/z_e.png" border="0" alt="spa" width="18" height="18" name="image5"/> Kontaktai</a>			</div>

	  <div style="padding-top: 30px;" id="content">
				<p>Tekstai visi išvedami čia </p>
			  </div>
	</div>
</div>
<div class="div_footer">Footoeris</div>
</div>
</body>
</html>

 

 

Styles CSS:

/* CSS Document */
body {
background-image: url(image/bg.jpg);
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #383838;
margin: 0px;
padding: 0px;
}

p {
padding: 0px;
margin: 0px;
}

/*Nustatome puslapio parametrus ir dydi*/
#conteiner {
display: block;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #383838;
margin: 0px;
padding: 0px;
width: 890px;
vertical-align: top;
}

/* Logo Flash Divas*/
.div_logo_flash {
display: block;
width: 290px;
height: 196px;
}


/*Nustatome DIVU dydzius*/
.div_proceduros {
display: block;
width: 290px;
float: left;
}

.div_content {
display: block;
width: 600px;
float: right;
}

/*Logo class'es ir id'ais*/
.div_logo {
background-image: url(image/logo.jpg);
background-repeat: no-repeat;
width: 290px;
height: 196px;
}


/*MENU DIVAS*/
#div_menu {
background-image: url(image/menu_bg.jpg);
background-repeat: no-repeat;
width: 600px;
height: 248px;
}

#menu {	
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
color: #685e47;
text-decoration: none;
padding-top: 25px;
font-weight: bold;
}

#menu a {	
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
color: #685e47;
text-decoration: none;
padding-top: 25px;
font-weight: bold;
}

#menu a:hover {	
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
color: #685e47;
text-decoration: none;
padding-top: 25px;
font-weight: bold;
}

/*Prasideda CONTENT*/
#content {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #383838;
font-weight: normal;
}

/*Proceduros class'es ir id'ais*/
#proceduros {
display: block;
float: left;
background-image: url(image/proceduros.jpg);
background-repeat: no-repeat;
width: 290px;
height: 316px;
}


/*Nusttome tam tikru DIV'u background'us ir size*/
.div_footer {
display: block;
vertical-align: bottom;
background-image: url(image/footer.jpg);
background-repeat: no-repeat;
width: 890px;
height: 99px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #383838;
}

 

Taip rodo programinis langas [Tinka toks variantas]:

http://www.spasvaja.lt/svaja/geraisvaja.jpg

 

Taip rodo IE:

http://www.spasvaja.lt/svaja/pataisymaiie.jpg

 

Taip rodo FF:

http://www.spasvaja.lt/svaja/ff.jpg

 

Ačiū žmonės už suteiktą pagalbą :)

Nuoroda į pranešimą
Dalintis kituose puslapiuose

Prisijunkite prie diskusijos

Jūs galite rašyti dabar, o registruotis vėliau. Jeigu turite paskyrą, prisijunkite dabar, kad rašytumėte iš savo paskyros.

Svečias
Parašykite atsakymą...

×   Įdėta kaip raiškusis tekstas.   Atkurti formatavimą

  Only 75 emoji are allowed.

×   Nuorodos turinys įdėtas automatiškai.   Rodyti kaip įprastą nuorodą

×   Jūsų anksčiau įrašytas turinys buvo atkurtas.   Išvalyti redaktorių

×   You cannot paste images directly. Upload or insert images from URL.

Įkraunama...
  • Dabar naršo   0 narių

    Nei vienas registruotas narys šiuo metu nežiūri šio puslapio.

×
×
  • Pasirinkite naujai kuriamo turinio tipą...