Problem z Menu/kontakt box

shinakol · Post przez **shinakol** » środa, 9 lutego 2011, 22:42

Witam serdecznie, przypominam sobie właśnie Pana kurs xhtml/css i napotkałem problem. Postaram się opisać to najprościej jak potrafie.

Obrazek

Jak widać na powyższym zdjęciu, stworzyłem menu z zastosowaniem Styli CSS, i dodatkowo chciałem zrobić kontakt boxa który jest ustawiony wyzej(jak widac na obrazku, ale ucielo kawalek). glwony kontener jest relatywny, wszystkie elementy sa pozycjonowane absolutnie wzgledem glownego kontenera, z umiejscowieniem elementow nie mialem problemow, lecz po skonczeniu, pojawil sie problem, mianowicie, gdy najezdzam myszka na "zakladki" menu, to nie zmienia mi sie kursor, (nie moge ich wl.) tak jak by były tłem. Nastepnie, gdy klikne np na (multimedia ) i przeciągne to przeciaga mi multimedia i ten box z kontaktem. Gdy uzyje opcji !important na boxie kontaktowym, to juz pozniej nie bardzo mam jak go wypozycjonowac wzgledem tego relatywnego, po prostu sie wszystko miesza. w skrocie, co zrobic by te 2 "pudeleczka" nie ingerowały w siebie. Jakies sugestie? ponizej screen wyjasniajacy o co mi chodzilo z tym "przeciaganiem" jesli zagmatwałem sprawe:) / robilem praktycznie tak jak na pana kursach przy tworzeniu strony VideoK~.

(złapałem za zakladke "multimedia")
Obrazek

I jeszcze druga sprawa, - Jak zrobić by to zielone tło było tłem a chcąc przejsc do danej zakladki musial bym kliknac w NAPIS dla przykladu (multimedia) a nie tak jak teraz ze wystarczy na obojetnie ktorym miejscu w danej zakladce kliknac.

ps/ pisalem na szybko, bez uwzgl. bledow ort. z gory przepraszam.

Post przez **Morfidon** » środa, 9 lutego 2011, 23:12

Witam,

Bez kodu się nie obędzie, ciężko się bez niego domyśleć co zrobiłeś źle.

Pozdrawiam

shinakol · Post przez **shinakol** » czwartek, 10 lutego 2011, 00:06

HTM~:

Code: Zaznacz cały

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
  <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
  <meta name="Description" content=" [wstaw tu opis strony] ">
  <meta name="Keywords" content=" [wstaw tu slowa kluczowe] ">
  <meta name="Author" content=" [dane autora] ">
  <meta name="Generator" content="kED2">

  <title> [tytuł strony] </title>

  <link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div align="center">
		<div id="kontener">
			<div id="gorna_czesc_kontenera">
			<a href="#"><img class="logo" src="logotyp.png" alt="logo pewny sukces"></a>
			<div id="gorne_menu">
			
			<ul id="wlasciwe_gorne_menu">
			
			<li style="border-left: 3px solid gray;"><a href="#"><span class="link">Multimedia</span></a></li>
			<li><a href="#"><span class="link">Informacje</span></a></li>
			<li><a href="#"><span class="link">artykuly</span></a></li>
			<li><a href="#"><span class="link">cos tam</span></a></li>
			<li><a href="#"><span class="link">noasdd</span></a></li>
			<li><a href="#"><span class="link">FAQ</span></a></li>
			
			
			
			
			
			</ul>
			
			
			</div>
			<img src="kontakt_box.png" alt="kontakt"></a>
			</div>
			
		</div>
		
	</div>
	<div>

	</div>
</body>
</html>

style.css:

Code: Zaznacz cały

*
{
padding: 0;
margin: 0;
}






body

{
background-color: #efefef;
background-attachment: fixed;

}

#kontener


{
width:  1004px;
margin: 0 auto;
}

#gorna_czesc_kontenera

{
position: relative;
margin: 15px;
background-image: url('logo_tlo.gif');
width: 100%;
height: 207px;

}

img.logo
{
position: absolute;
border: 0;
left: 20px;
top: 10px;
}

img


/* kontakt box*/


{

position: absolute;
right: -21px;
top: -27px;

}

/*       MENU GORNE            */

#gorne_menu

{
position: absolute;
right: 0px;
top: 156px;

}

#wlasciwe_gorne_menu li

{
list-style-type: none;
float: left;
}

#wlasciwe_gorne_menu li a

{

background-image: url('tlo_menu.gif');
height: 50px;
display: inline-block;
float: left;
border-bottom: none;
padding: 0px 15px;
font-family: tahoma, arial, helvetica, san-serif;
font-size: 18px;
font-weight: bold;
color: white;
border-right: 1px solid black;
text-decoration: none;
}

.link

{
display: inline-block;
margin-top: 12px;

}

dla ułatwienia nawigacji:

kontakt_box.png - to własnie zdjecie tego obrazka z emailem.

Post przez **Morfidon** » czwartek, 10 lutego 2011, 13:02

Chodziło mi bardziej oto, abyś mi podał linka do miejsca, gdzie będę widział wszystko, podaj link do strony beta (nie wiem dokładnie co wycięło).

Pozdrawiam

Kursy Programowania i Tworzenia stron WWW

Problem z Menu/kontakt box

Problem z Menu/kontakt box

Re: Problem z Menu/kontakt box

Re: Problem z Menu/kontakt box

Re: Problem z Menu/kontakt box