problem z buttonami i ich obramowaniem

0

Witam :P dzisiaj to juz druga rzecz z ktora mam spory problem coz ciezkie jest zycie poczatkujacego ;P
Zrobilem buttony na stronie cooltext.com caly cykl wyglada tak wybor czcionki>caly wyglad buttonu/cienie etc./pobieranie buttonu (2 obrazki 1 jak myszka nie jest na buttonie a drugi jak jest) wkladam je do tego samego folderu w ktorym jest cala strona i biore linka np taki
cooltext435166440.png

dodaje na poczatek
wszystko jest ladnie pieknie ale... na stronie wyswietlaja sie na poczatku male prostokaty (koloru "wcisnietego linka") po najechaniu na nie myszka pojawiaja sie buttony jednakze wciaz z wkurzajacym obramowaniem...

Juz opisalem moj problem mianowicie moim pytaniem jest : czy moglby mi ktos powiedziec jak usunac obramowanie i poprawnie ustawic wyswietlanie buttona na stronie (odrazu button a nie maly prostokacik dopiero po najechaniu myszka button)

0
fixx napisał(a)

czy moglby mi ktos powiedziec jak usunac obramowanie

<img src="cooltext435166440.png" onmouseover="this.src='cooltext435166440MouseOver.png';" onmouseout="this.src='cooltext435166440.png';" border="0" />

0

niestety juz to probowalem guzik znika po dodaniu tego w kod zaraz wrzuce screen shota jak to wyglada
edit.
tak to wyglada swiezo po odswiezeniu strony
http://img14.imageshack.us/i/menuproblemm.jpg/
a tak po najechaniu myszka na spora czesc tego fioletowego prostokata na pierwszym obrazku
http://img196.imageshack.us/i/menuproblem.jpg/

0

mi sie guzik wcale nie wyswietla (w twoj text wstawilem tylko moje zdjecia)

http://img32.imageshack.us/gal.php?g=eventsmouseout.png

moglbys zrobic tak zeby to dzialalo z tych 2 ? bo jak probuje tego kodu co wczesniej podales(wpisujac poprawne nazwy zdjecia przed i zdjecia po) sie nie wyswietla ... ;/

0

Ja mam to na CSS zrobione i śmiga jak należy. Przyjrzyj się i popraw swój kod:

Kod menu w index:

<div id="header">
    	<div class="content">
        	<h1><a href="/">KamilNamysla.pl</a></h1>     	
			<ul>
            	<li><a href="css/webdesign.html">WEBDESIGN</a></li>
                <li><a href="css/fotomontaze.html">FOTOMONTAŻE</a></li>
                <li><a href="css/inne.html">INNE</a></li>
                <li><a href="css/kontakt.html">KONTAKT</a></li>
           </ul>          
        </div>  
    </div>

Klasy w CSS:

#header {
    position: relative;
	height: 102px;
	border-bottom: 1px solid #fff;
	background: url(../images/headertlo_01.jpg);
	width: 100%;
	}
	
#header h1 {
	position: relative;
	top: 6px;
	left: -7%;
	overflow: hidden;
}	
	
#header h1 a {
	display: block;
	width: 244px;
	height: 82px;
	background: url(../images/logo.png) no-repeat;
	text-indent: -666em;
	}

#header ul { overflow: hidden; position: absolute; right:20%; bottom: -5px; list-style: none;}
#header ul li { float: left;}
#header ul li a { display: block; padding: 10px 12px 40px; color: #787878; font: 17px tahoma, verdana, arial, sans-serif; text-decoration: none;}

#header ul li a:hover { background: url(../images/light.png) bottom  repeat-x; padding: 7px;} 
0

@Robster:
BTW., jeśli Cię to interesuje, to czytniki ekranu mogą mieć pewien problem z tekstem linków pisanym wielkimi literami. Takie ciągi znaków są przeważnie rozumiane jako skróty i odczytywane litera po literze ("INNE" byłoby przeczytane nie jako "inne", ale "i-en-en-e"). Rozwiązaniem jest napisanie tekstu linków przy użyciu liter normalnej wielkości i użycie na nich text-transform: uppercase (deklarację tą można dołączyć do #header ul lub #header ul li).

To jednak bardziej (drobna) kwestia ideowa: że niby użycie kapitalików to w tym wypadku rzecz związana z prezentacją, a więc powinna być realizowana w arkuszach stylów.

0

juz sobie poradzielem :P wielkie dzieki za pomoc

0
bswierczynski napisał(a)

@Robster:
BTW., jeśli Cię to interesuje, to czytniki ekranu mogą mieć pewien problem z tekstem linków pisanym wielkimi literami. Takie ciągi znaków są przeważnie rozumiane jako skróty i odczytywane litera po literze ("INNE" byłoby przeczytane nie jako "inne", ale "i-en-en-e"). Rozwiązaniem jest napisanie tekstu linków przy użyciu liter normalnej wielkości i użycie na nich text-transform: uppercase (deklarację tą można dołączyć do #header ul lub #header ul li).

To jednak bardziej (drobna) kwestia ideowa: że niby użycie kapitalików to w tym wypadku rzecz związana z prezentacją, a więc powinna być realizowana w arkuszach stylów.

Wielkie dzięki za informację, nie wiedziałem że tak to jest interpretowane ^^

1 użytkowników online, w tym zalogowanych: 0, gości: 1