Toisiinsa vaikuttavat divit
-
Laitoin tästä jo Discordiin, mutta laitetaas tännekin.
https://talviunia.ruusukka.org/talviunia/elvetarc/index.php
css: https://talviunia.ruusukka.org/talviunia/elvetarc/tyyli/tyyli.cssHaaveissa oli laittaa sivupalkkiin jotain sälää, mahdollisesti käyttäen ylimmällä elementillä marginia tms. niin ettei tule päällekäisyyttä tuon .sisalto divin ylimmän taulukkoelementin kanssa. Kuitenkin aina laittaessa marginia sivupalkkiin joko ylimpään elementtiin tai ylä paddingia itse sivupalkille, siirtyy myös .sisalto -divin sisältö vastaavasti alas päin. Samat kuviot myös toiste päin.
Onkohan tähän mikä syynä ja mitään korjaavaa liikettä vai yritänkö suosiolla toteuttaa jotenkin muuten?
-
Ideana siis, että sivupalkki + sisältö on koko näytön levyinen ?
Lähtisin itse ekaks kokeilemaan vaihtamalla tälläsen CSS-koodiin (en tiedä ratkaiseeko ongelmaa kokonaan jos ollenkaan, hehe):
#pohja { display: table-row; } #sivu { background-color: #ccc; width: 300px; display: table-cell; } #sisalto { background-color: rgba(0,0,0,.075); padding: 20px 0px; display: table-cell; }
edit // ja koska footerin width on jo sata prossaa, ottaisin margin: auto; kokonaan poies
-
@leahiiii Kyllä. Yritin ensin istuttaa sivupalkkia sisalto -divin sisään, mutta ee minkää tekijäks enkä jaksanu floattien kanssa leikkiä. En oo leikkiny nuitten table displaytten kanssa koskaan myöskään, mut kokkeillaan!
/ @leahiiii Noin muute joo, mutta nyt ei korkeussuunnassa täytä sivua.
https://talviunia.ruusukka.org/talviunia/elvs/kuvak.png -
@serena floatit onkin ihan perseestä kun ne ei ikinä toimi halutulla tavalla mää on ihan hurahtanu table displayihin divien kanssa kun ulkoasun layoutista kyse, niin ihanan helppoja ja aina toimii mulla ton #pohja divin voi periaatteessa kans poistaa, noi table-cellit toimii ilman että siinä ympärillä on "äiti diviä" table row'na.
mun aivojen logiikan mukaan tolle #sisalto -diville ei tarvii määrittää leveyttä ollenkaan, vaan se täyttää sit sen mitä sivupalkista jää jäljelle jos ei #pohja -divillä oo myöskään mitään leveysmääritelmää
toi korkeussuunta on joo kinkkinen. ite oon aina kiertäny sen sillä, että tiedän et jokaiselle sivulle tulee niin paljon tekstiä et heittää alas venaas mää tutkin omia koodeja.
-
@leahiiii Siis joo, floatit on joku pimeyden keksintö varmasti!
Täytyy perehtyä noihin table displayhin vaikka tän ulkan kanssa paremmin, vaikuttaa kätevältä. Ja tosiaan, ennen tätä vääntöä sisalto -div ei halunnut olla 100% tai sitten se valui sivun yli, joten sitä peruja saatto jäähä tuo tuonne.
Epäilemättä mullakin tulee sisältöä sen verran joka sivulle, ettei korkeuden pitäisi olla ongelma, mutta jotenkin sitä haluaa ymmärtää silti miksi ja miksi ei.
-
@serena nonni, hyvä ! jollakin min-height -määrittelyllä sen korkeuden voi saada, mutta se voi sit aiheuttaa myös ongelmia ääh, en nyt tähän hätään keksi, pitää alkaa mennä nukkumaan että jaksaa raahautua aamusta töihin
-
@leahiiii Joo kokeilin tuossa jo min-heightejä pikaisesti ja niillä ei ollut mitään vaikutusta. Mutta tosiaan, ehkä mie unohdan et toi nyt ei oo ihan täydellinen ratkaisu ja heitän hitokseen sisältää sivuille.
-
Uutta ongelmaa pukkaa!