Witam.

Mam graficzkę która bazowo składa się z 3 części: GÓRA, ŚRODEK, DÓŁ.

Wszystko jest jednak cieniowane w dość specyficzny sposób (tzn. nie ma jednostajnego przejścia).

Bazowo przyjmimy że GÓRA i DÓŁ mają 10 px, ŚRODEK natomiast 50px.

W takich rozmiarach wszystko wyświetla się prawidłowo, kiedy jednak tekst na ŚRODEK przekroczy 50px, graficzkę trzeba odpowiednio rozciągnąć. Jeżeli jednak nie zrobimy tego o kolejne 50px. To łączenie ŚRODEK z DÓŁ (GÓRA pozostanie niezmienieona) będzie miało wyraźne przejście.

Pytanie brzmi jak zrobić, aby w momencie przekroczenia tych 50px graficzka dodała całe kolejne 50px?

Tylko javascript. Nie ma takiej możliwości w css.

a czy mógłbym prosić o jakiś link do takiego rozwiązania, ewentualnie o słowa kluczowe do wyszukiwania bo nie mam nawet pojęcia jak zacząć tego szukać na google... :/

A znasz w ogóle javascript?

słabo...

ale jak o tym napisałeś to pierwsze co mi przyszło do głowy to z pomocą jquery pobrać aktualną wysokość środkowego diva i odpowiednio zwiększyć.
Dobrze kombinuje?

Tak. Oczywiście wszystko po załadowaniu strony.