Kliknięcie zdjęcia przez całą stornę

Witam,

mam taki problem, iż zamiast moje zdjęcie otworzyć się tylko przez kliknięcie w nie, może klikać na całej szerokości w to zdjęcie.

Więcej pokazane na screenie:

Po kliknięciu w miejsca gdzie są strzalki, to zdjęcie także się otwiera.

Jak zrobić, aby tylko w zdjęcie można było kliknąć?

Poprosimy o kod, bo baterie w szklanej kuli padły  

    <div class="clearfix"></div>
    <div class="container-fluid">
        <h2>Kim jestem...</h2>
        <div class="row-fluid">
            <div class="span12">
                <p><li>Od kilku lat zajmuję się profesjonalnie grafiką komputerową. Nie wzoruję się innymi, w momencie tworzenia swoich kreacji, otwieram własny umysł i tworzę według własnych uznań. W ten oto sposób zdobywam niesamowite rezultaty. Zawsze staram się dążyć do pełnej perfekcji, nie tylko w dziedzinie grafiki komputerowej, ale także w życiu codziennym, niezależnie co jest tworzone z moim udziałem. Każdą pracę realizuję tak, jakbym miał to robić dla siebie samego.  
				<br>Szczerze? Nie pamiętam jak zaczęła się moja cała przygoda z grafiką. Jedyne co wiem, to, że nie urodziłem się geniuszem. Każde moje dzieło było, jest i będzie tworzone z mojej ciężkiej nauki i zdobytego doświadczenia. Wybrane prace graficzne można obejrzeć w moim oficjalnym <a href ="portfolio/index.html">portfolio</a>.
				<a href="images/image2.png" class="fresco" data-fresco-caption="Lateray - Graphic Designer"><img class="displayed" src="images/image1.png" /></a>
			 <div class="name muted">Robert Truszkowski</div></li></p>
        </div>
        </div>

        <hr>

		        <h2>Moje realizacje:</h2>
        <div class="row-fluid">
            <div class="span12">
                <ul>
                <li>Layout'y do stron internetowych</li>
                <li>Loga i logotypy dla firm oraz osób prywatnych</li>
                <li>Bannery reklamowe, grafiki na Facebook'a [np. zdjęcia w tle]</li>
                <li>Plakaty i reklamy [np. organizowanie imprezy, wykładu, spotkania]</li>
                <li>Ulotki oraz różnego rodzaju broszury</li>
                <li>Różnego rodzaju projekty opakowań</li>
                <li>Buttony małych wymiarów, również w postaciach animacyjnych .gif [np. reklama na inną stronę]</li>
                <li>Różnego rodzaju grafiki do sliderów</li>
				<li>Edycje zdjęć, wymiana tła, rozjaśnianie, poprawianie ostrości</li>
                </ul>
            </div>
        </div>

		
		img.displayed {
            display: block;
            margin-left: auto;
            margin-right: auto;	
	        opacity: 1;
			height: 198px;
			weight: 198px;
	        -webkit-transition: -moz-transform .2s ease-out; 
            -moz-transition: -webkit-transform .2s ease-out; 
            -o-transition: -o-transform .2s ease-out; 
            transition: transform .2s ease-out; 
	    }
		
		img.displayed:hover {
            display: block;
            margin-left: auto;
            margin-right: auto;	
	        opacity: 0.8;
	        -moz-transform: scale(0.9);
            -webkit-transform: scale(0.9);
            -o-transform: scale(0.9);
	
	    }

Coś jeszcze więcej potrzeba?

width, a nie weight: 198px;

Poprawione,

lecz problem dalej ten sam.

a.fresco{width:198px}

Biorąc pod uwagę kwestię czy tylko tutaj mamy link z taką klasą

O co dokładniej chodzi?

A przenieś to zdjęcie z <li></li> do oddzielnego diva pod tym z napisem i ustaw szerokość oraz wysokości sprawdź czy będzie ten sam efekt.

Okej poradziłem sobie już z tym problemem. Mam pytanie jeszcze a zarazem prośbę.

To zdjęcie tutaj, wiem że to pewnie podstawy, śmieszne że o to pytam, ale naprawdę się uczę dopiero i zależy mi na tym, aby się nauczyć

Musisz ul ustawić float:left, później zaraz za ul wstawić html tego zdjęcia i ustawić mu float:right;

Musisz ul ustawić float:left, później zaraz za ul wstawić html tego zdjęcia i ustawić mu float:right;

A faktycznie bootstrap Nie zwróciłem uwagi nawet. Śledzisz go, czy też jesteś na forum dla gimbów?

A faktycznie bootstrap Nie zwróciłem uwagi nawet. Śledzisz go, czy też jesteś na forum dla gimbów?

Czyli jak oficjalnie na bootstrapie to zrobić?

Wrzuć html ze zdjęciem obok diva w którym jest ul, czyli obok tego z klasą span12 a później popróbuj obu ustawić odpowiednie klasy tak żeby ich 'suma' była równa 12.

Czyli np temu co masz teraz daj span9 a nowego span3 próbuj tak robić aż otrzymasz zadawalający efekt.