[HTML]Cały div na linka Opcje

[michat34]

Witam mam takie cos:

[SMARTY] pobierz, plaintext 
{section name=i loop=$news}
                    <div class="news">
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
                    </div>
{/section}
[SMARTY] pobierz, plaintext 

kazde ogloszenie to nowy div o szerokosci 1000px i nieustalonej wysokosci (zalezy od dlugosci desciption). Teraz chcialbym aby po kliknieciu diva przenosilo mnie do szczegolowego opisu newsa (pelen description, mozliwosc komentowania itd). jak to zrobic? myslalem nad:

[SMARTY] pobierz, plaintext 
{section name=i loop=$news}
    <a href="index.php?news_id={$news[i].news_id}">
                    <div class="news">
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
                    </div>
      </a>
{/section}
[SMARTY] pobierz, plaintext 

ale to mi robi tak, ze tekst w divie jest klikalny a nie cały div. Jak zrobic zeby caly div byl linkiem? Robienie klasy linka o okreslonych wymiarach nie zda egzamnu bo nie znam wysokosci wiec prosze o inne propozycje

[vifus]

[HTML] pobierz, plaintext 
#link a {
  width: 100px;
  height: auto;
}
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
{section name=i loop=$news}
    <div id="link"><a href="">
                    <div class="news">
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
                    </div>
      </a>
{/section}
</a></div>
[HTML] pobierz, plaintext 

[Adis92]

vifus w twoim poście zagnieżdżają się dwa linki w sobie!

[vifus]

Fakt, nie zauważyłem..

[Adis92]

[HTML] pobierz, plaintext 
{section name=i loop=$news}
                    <div class="news" onClick="location.href='index.php?news_id={$news[i].news_id}'">
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
                    </div>
{/section}
[HTML] pobierz, plaintext 

[michat34]

Wolałbym nie robic tego w JS. Narazie zastosowalem rozwiazanei kolegi ale wole to rozwiazac w CSS. Sposob vifusa nie dziala ktos ma jeszcze jakies pomysly? Nie wierze ze nie da sie tego elegenako rozwiazac w css...

Ten post edytował michat34 9.12.2012, 22:56:48

[thurinon]

Daj linkowi w tym divie display:block, a divowi odpowiedni rozmiar. Ale musisz się pozbyć podlinkowania w miejscu gdzie wyświetlasz autora, bo masz link zagnieżdżony w linku.

[Adis92]

Ale autor posta napisał że wielkość jest nieznajoma więc nie da.

[michat34]

tak wysokosci nie znam. no nie wierze ze w wersji 3 css'a nie ma dobrego sposobu na takie cos...

[thurinon]

Kod

.news {width: 1000px; }
a {display: block;}

Kod

{section name=i loop=$news}
    <a href="index.php?news_id={$news[i].news_id}">
                    <div class="news">
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}">{$news[i].login}</a> ({$news[i].replies} odpowiedzi)
                    </div>
      </a>
{/section}

To po prostu działa przynajmniej teraz u mnie na localu i chromie

Tylko popraw tego baboka z <a>cośtam<a>autor</a>cośtam</a>
na <a>cośtam</a><a>autor</a>cośtam

[Adis92]

Thurinon w Twoim sposobie zagnieżdżają się dwa linki.
Sprawdziłem i u mnie działa

[CSS] pobierz, plaintext 
div.news{
	width: 500px;
	border: 1px solid #000;
	position: absolute;
	display: block;
	overflow: hidden;}
 
div.news > a{
	z-index: 5;
	position: absolute;}
 
div.news > a.link{
		width: 100%;
		position: absolute;
		display: inline-block;
		height: 100%;
		top: 0;
		left: 0;
		bootom: 0;
		right: 0;}
[CSS] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div class="news">
                    	<a href="index.php?news_id={$news[i].news_id}" class="link"></a>
                        <p>
                        {$news[i].title} ({$news[i].add_timestamp})<br>
                        {$news[i].description|truncate:200:"..."}<br>
                        Dodany przez <a href="index.php?action=2&user_id={$news[i].author_id}" class="reszta">{$news[i].login}</a> <br/>
                        ({$news[i].replies} odpowiedzi)</p>
                    </div>
[HTML] pobierz, plaintext 

Ten post edytował Adis92 10.12.2012, 23:05:35

[thurinon]

Adi wiem, że zostawiłem zagnieżdżony, i napisałem o tym (IMG:style_emoticons/default/smile.gif) mimo to działa, a że miałem zły humor to nie wysilałem się (IMG:style_emoticons/default/smile.gif) . JA po prostu poszedł bym na łatwiznę i nie linkował bym autora.
Twój sposób jest bardzo sprytny - gdybym mógł kliknął bym "Pomógł" ;-]

[Pawel_W]

z-index działa też dla position: relative, używanie tutaj position absolute dla wszystkich elementów nie jest dobrym wyjściem (IMG:style_emoticons/default/wink.gif)