Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Din ce este facuta terasa asta?

Cum accesez site-ul CNAS ?

Algoritm simplu de calculare al u...

Bitdefender Total Security ș...
 casa verde 2024

Intrerupator cu N - doza doar cu ...

Incalzire casa fara gaz/lemne

Incalzire in pardoseala etapizata
 Suprataxa card energie?!

Cum era nivelul de trai cam din a...

probleme cu ochelarii

Impozite pe proprietati de anul v...
 teava rezistenta panou apa calda

Acces in Curte din Drum National

Sub mobila de bucatarie si sub fr...

Rezultat RMN
 

a:hover - imi impinge si celelalte elemente

- - - - -
  • Please log in to reply
3 replies to this topic

#1
colombo2003

colombo2003

    Senior Member

  • Grup: Senior Members
  • Posts: 6,312
  • Înscris: 16.07.2008
Problema imi apare atunci cand as vrea ca la hover sa fac textul boldit. Motiv pentru care, in css, adaug font-weight: bold, intr-o sectiune noua: .jos a:hover { } (nu apare in codul de mai jos)

Fiind mai gros, imi impinge si restul de elemente (celelalte linkuri text si bara verticala de separate |) si se deplaseaza nitel; or eu as vrea sa ramana fixe, la locul lor si doar elementul de la hover sa devina mai gros si atat. Ce gresesc?

Multumsc


In HTML:
...
...
<div class="jos">
	 <a href="DespreNoi.php">Laboratoare</a> |
	 <a href="Consiliu.php">Consiliu</a> |
	 [i]si alte <a>-uri similar[/i]
</div>
...
...


In CSS:
...
...
.jos {
text-align: center;
padding-bottom: 5%;
}
.jos a {
margin: 0 2%;
font-size: 12px;
}
...
...


Edited by colombo2003, 25 March 2015 - 15:03.


#2
miki07

miki07

    Simplu și banal

  • Grup: Senior Members
  • Posts: 16,940
  • Înscris: 18.09.2008
http://stackoverflow...st-when-a-hover

Vezi, poate ajuta. Nu am acum timp sa documentez mai bine problema ta.

#3
sergiu_spooky

sergiu_spooky

    Senior Member

  • Grup: Senior Members
  • Posts: 3,738
  • Înscris: 23.06.2006
Nu gresesti nimic dar ce vrei tu sa faci e o contradictie - adica sa ai si latime dinamica (display: inline) dar container-ul sa-si pastreze latimea indiferent de latimea/dimensiunea textului.
Solutia e sa pui latimi fixe la fiecare text (evident cu display: inline-block pe ele) care sa fie cel putin cat latimea textului boldat. Eventual pui si text-align: center pe fiecare container sa arate mai bine.

<div class="link">
    <a href="#">Foo</a>
</div>
<div class="link">
    <a href="#">Foo</a>
</div>
<div class="link">
    <a href="#">Foo</a>
</div>

.link {
  display: inline-block;
  width: 100px;
  text-align: center;
}

.link a:hover {
  font-weight: bold;
}

Vezi ca pe stackoverflow se discuta si de o varianta cu display: table, dar e mai complicat de inteles.

#4
colombo2003

colombo2003

    Senior Member

  • Grup: Senior Members
  • Posts: 6,312
  • Înscris: 16.07.2008
Aham, vad ca tu ai pus fiecare ancora (link) separate intr-un div din aceeasi clasa (si nu toate la un loc).

Nu prea am inteles ce ai zis tu pe acolo cu chestia aia cu inline... In fine, de functionat functioneaza, dar nu inteleg o chestie. Ca test, am obiceiul sa pun si un border elementului, ca sa vad exact cat tine, cum se pozitioneaza si incadreaza etc.
Revenind, problema acum e ca, fiecare link are numar diferit de litere (deci lungime diferita), si cum am dimensionat astfel incat sa incapa, boldit, sirul cel mai lung, celelalte, cum sunt centrate toate, au distante diferite fata de separatorul |

De functionat functioneaza, dar mi se pare ca se vede un pic aiurea... :D Adica ceva de genul  link1  |    link doi      |    trei     | al patrulea link | cinci    | etc   

Cred ca am sa renunt la chestia cu hoover-ul si gata. Ma gandeam sa o pun, doar ca sa atrag atentia unde e mouse-ul, cumva ca optiune curenta.

Multumesc pentru raspunsuri.

Anunturi

Bun venit pe Forumul Softpedia!

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate