Neaiškumai su CSS/HTML

Balandžio 27, 2012

Sveiki, bandžiau kurt navigaciją. Mintis buvo tokia, kad užvedus pelyte mygtukas padidėtų 20%. Viskas yra kaip ir gerai, tik padidėjęs mygtukas daro efektą esantiems iš dešinės ir juos šiek tiek pastumia. Kaip tai pataisyt? :huh: Įdedu kodą.

<!DOCTYPE html>
<html>
<head>
<title>Navigacija</title>
<style type="text/css">
	body {
		font-family: sans-serif;
		font-size: 27px;
	}

	nav li {
		display: inline;
		float: left;
	}

	nav a {
		background: #3e3e3e;
		text-decoration: none;
		padding: 10px 15px;
		color: orange;
		box-shadow: 0 0 2px rgba(0, 0, 0, .5);
		border-radius: 5px;
		transition: padding;
		text-shadow: 0 0 1px orange;
	}

	a:hover {
		background: orange;
		color: #3e3e3e;
		box-shadow: 0 0 5px rgba(0, 0, 0, .5);
		padding: 15px 20px;
		box-shadow: 0 0 10px rgba(255, 255, 255, .5) inset;
		text-shadow: 0 0 1px #3e3e3e;
	}

	a:active {
		box-shadow: 0 0 5px rgba(0, 0, 0, .5);
	}
</style>
</head>
<body>
<nav>
	<ul>
		<li><a href="#">Home</a></li>
		<li><a href="#">Forum</a></li>
		<li><a href="#">News</a></li>
		<li><a href="#">Shop</a></li>
		<li><a href="#">Contact</a></li>
	</ul>
</nav>
</body>
</html>

Balandžio 27, 2012

Tai tu pagalvok logiskai jei jis db yra 100% o uzvedus buna 120% tai kaip jis tips i ta pacia skyle ? :lol: daryk tada kad didetu tik aukstis

 a:hover

padingus keiciam i

 padding: 15px 15px;

Balandžio 27, 2012

Tau reikia kad pats mygtukas padidėtų, ar šriftas, kuriuo užrašomas pavadinimas? Pirmas variantas, kaip pasakė kolega, nevisai įmanomas. Nebent kiekvieną mygtuką kišti dar į papildomą fiksuoto pločio konteinerius. Su šriftais tas pats - jeigu didės šriftas ir blokas nebus fiksuoto dydžio, tai jis automatiškai irgi didės. Jeigu nenori, kad judintųsi, gali bandyti daryti pavyzdžiui taip:

nav li { width: 300px; float: left; display: inline-block; }
nav li a {font-size: 1em; color: #ABABAB; display: block; ....}
nav li a:hover {font-size: 1.2em;}

Redagavo Balandžio 27, 2012 vitalikaz

Balandžio 27, 2012

Tai tu pagalvok logiskai jei jis db yra 100% o uzvedus buna 120% tai kaip jis tips i ta pacia skyle ? :lol: daryk tada kad didetu tik aukstis
 a:hover 
padingus keiciam i
 padding: 15px 15px;

tai taip, suprantu, kad jis tampa 20% didesnis, todėl ir noriu padaryt taip, kad jis padidėtų virš kitų mygtukų, kitaip sakant juos pridengdamas, bet nenustumdamas į šoną. Kažką čia suvėliau, bet tikiuosi supratai. :lol:

Tau reikia kad pats mygtukas padidėtų, ar šriftas, kuriuo užrašomas pavadinimas? Pirmas variantas, kaip pasakė kolega, nevisai įmanomas. Nebent kiekvieną mygtuką kišti dar į papildomą fiksuoto pločio konteinerius. Su šriftais tas pats - jeigu didės šriftas ir blokas nebus fiksuoto dydžio, tai jis automatiškai irgi didės. Jeigu nenori, kad judintųsi, gali bandyti daryti pavyzdžiui taip:
nav li { width: 300px; float: left; display: inline-block; }
nav li a {font-size: 1em; color: #ABABAB; display: block; ....}
nav li a:hover {font-size: 1.2em;}

ne, man reik visą mygtuką padidint taip, kad jis nenustumtų kitų į šoną.

Balandžio 27, 2012

Labas, pabandyk taip:

a:hover
{    
-moz-transform:scale(1.2);
-webkit-transform:scale(1.2);      
-moz-transition: .5s ease-in-out;
-webkit-transition: 0.3s ease-in-out;
}

Redagavo Balandžio 27, 2012 Dhoviuz

Balandžio 29, 2012

aš manau turėtum keist poziciją į absolute ar kažką panašaus... Kitaip nieko negausi kitų mygtukų nepalietus :)

Prisijungti

Neaiškumai su CSS/HTML

Rekomenduojami pranešimai

SarasJ 17

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Klicko 453

Nuoroda į pranešimą

Dalintis kituose puslapiuose

vitalikaz 212

Nuoroda į pranešimą

Dalintis kituose puslapiuose

SarasJ 17

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Dhoviuz 533

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Rhymond 223

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Prisijunkite prie diskusijos

Dabar naršo 0 narių

Prisijunk prie bendruomenės dabar!

Naujausios temos

Karštos temos

Veiklos srautas

Skelbimai