Hinnavaatlus
:: Foorum
:: Uudised
:: Ärifoorumid
:: HV F1 ennustusvõistlus
:: Pangalink
:: Telekavad
:: HV toote otsing
|
|
autor |
|
Kethmar
Kreisi kasutaja

liitunud: 21.06.2006
|
20.06.2008 01:56:16
CSS menüüga probleem. |
|
|
Tere.
Tekkis css-is selline probleem.
Nimelt lehe vasakul ääres on mul vertikaalne menüü(ülevalt alla) .
Asi toimib nii, et vajutades näiteks "uudised", tuleb kohe menüüsse uudiste alla uudiste nimekiri.
Probleem nüüd selles, et ma ei jaga matsu, kuidas ma saan teha nii, et sisu ja menüü üksteisest ei sõltuks.
Praegu proovisin teha positsion:absolute; -ga, aga see ei lahendanud samuti probleemi ja ma ei tea kas ma olen väga loll kuid mina asjaga hakkama ei saanud.
Kui absolute ära võtta, on leht nii, nagu peab, AGA sisu alustab alles sealt, kus menüü osa lõppeb.
Ei ole kindel, kas seletasin nii, nagu vaja.
Igaljuhul, kes aidata raatsib(asi ei tohiks olla tegelt raske, lihtsalt, minu loogika ei jõudnud sinna), siis siin on väga lihtne sama süsteemiga asi:
http://www.friday.ee/kethmar/Untitled-1.htm
Asi, mida tahan, et lõpuks saaks, on see, et kogu lehe osa tuleks menüüga kaasa, kui menüü pikem on. Seda saab teha nii, et võtan absolute ära, kuid siis läheb sisu osa valesse kohta, kuigi vajalik on, et ta jääks samasse kohta, kus ta oli siis, kui absolute oli peal.
Olen kindel, et see pole raske asi.
Väga suured tänud neile, kes abistavad!
_________________ Kodulehekülg: http://kethmar.ee/university
Vajad veebilahendust või graafilist abi? Küsi pakkumist. HV Rahvale alati odavamalt. |
|
Kommentaarid: 24 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
24 |
|
tagasi üles |
|
 |
mikk36
HV Guru

liitunud: 21.02.2004
|
20.06.2008 08:45:25
|
|
|
#menyline { float: left; }
#osa sisse lõppu pane div, millel paned clear: both css'ga
|
|
Kommentaarid: 85 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
2 :: |
78 |
|
tagasi üles |
|
 |
Renka
HV Guru

liitunud: 01.04.2002
|
20.06.2008 09:02:24
|
|
|
kui teed XHTMLis asja siis saab asjad väga lihtsalt kõrvuti. mõlemale elemendile float:left; HTML 4 puhul ei mäleta enam hästi kuidas tegutseda
_________________ There is no place like 127.0.0.1 |
|
Kommentaarid: 71 loe/lisa |
Kasutajad arvavad: |
   |
:: |
2 :: |
1 :: |
61 |
|
tagasi üles |
|
 |
Renka
HV Guru

liitunud: 01.04.2002
|
20.06.2008 09:04:01
|
|
|
mikk36, proovisid hetkel ise järgi ka? See lahendus töötab XHTML'is ilusasti aga hetkel kiiruga firebugis proovides ma soovitud tulemust ei saanud (HTML 4 määranguga).
_________________ There is no place like 127.0.0.1 |
|
Kommentaarid: 71 loe/lisa |
Kasutajad arvavad: |
   |
:: |
2 :: |
1 :: |
61 |
|
tagasi üles |
|
 |
mikk36
HV Guru

liitunud: 21.02.2004
|
20.06.2008 09:12:20
|
|
|
Renka kirjutas: |
mikk36, proovisid hetkel ise järgi ka? See lahendus töötab XHTML'is ilusasti aga hetkel kiiruga firebugis proovides ma soovitud tulemust ei saanud (HTML 4 määranguga). |
avasin lingi, vaatasin mis lehel on, klikkisin firebugi ikooni peale ja asusin muutma (ehk siis lisasin menüüle float: left, keelasin ära position käsu ja siis lisasin #osa sisse ühe divi (edit käsuga) ja määrasin tolle stiiliks clear: both)
kõik
mingit salvestamist ega välist editori ma ei kasutanud
või on minu töövõtted valed ?
|
|
Kommentaarid: 85 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
2 :: |
78 |
|
tagasi üles |
|
 |
Kethmar
Kreisi kasutaja

liitunud: 21.06.2006
|
20.06.2008 09:23:42
|
|
|
Mikk, proovisin, ei aidanud .
Kas mingi teise ehitusega ei saa samamoodi teha ?
_________________ Kodulehekülg: http://kethmar.ee/university
Vajad veebilahendust või graafilist abi? Küsi pakkumist. HV Rahvale alati odavamalt. |
|
Kommentaarid: 24 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
24 |
|
tagasi üles |
|
 |
mikk36
HV Guru

liitunud: 21.02.2004
|
20.06.2008 09:36:28
|
|
|
mnjaa, firefox3'ga on kõik ok, ie7 lennutab ikka alla
eks siis teine lahendus on ka #sisuplace'le float: left panna (ja ära unusta siis marginit-paddingut uuesti paika ajada)
|
|
Kommentaarid: 85 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
2 :: |
78 |
|
tagasi üles |
|
 |
Kethmar
Kreisi kasutaja

liitunud: 21.06.2006
|
20.06.2008 10:10:14
|
|
|
Mul ei olnud firefox3-ga ka korras, ma ei tea.
Tegin uue div-i <div id="clear"></div> ning nende tivide vahele jäi siis sisuplace.
clear css oli selline:
#clear {
clear:both;
}
positsion absolute võitsin menylt ära ning lisasin float left.
See, et sisuplacele float:left panin, ka ei aidanud.
Võtsin kõik muu ära, positsion:absolute ka, ning lisasin sisuplacele float:left.
Nii sai peaaegu soovitud tulemuse, ainult et sisu läheb alla .
Edit:
Aa, clear pidi ka peal olema, aga sisu jah, jääb ikka alla.
Arvan, et kõige lihtsam on öelda, et need kõrgused peaksid üksteisest sõltuma.
Kui sisu on lühem, kui menüü, siis selle(sisu) pikkus(mis on auto) läheb samaks, mis menüül.
Sellel lehel see sinine kast ääres funktsioneerib samamoodi, nagu mul peaks:
http://www.kaivitrans.ee/?id=1&keel=ee
_________________ Kodulehekülg: http://kethmar.ee/university
Vajad veebilahendust või graafilist abi? Küsi pakkumist. HV Rahvale alati odavamalt. |
|
Kommentaarid: 24 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
24 |
|
tagasi üles |
|
 |
mikk36
HV Guru

liitunud: 21.02.2004
|
20.06.2008 11:59:56
|
|
|
no ma ei tea
html:
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> body { margin-top:30px; background-color:#000000; background-repeat:repeat-x; } #konteiner { width:738px; height:auto; background-color:#FFFFFF; margin-left:auto; margin-right:auto; } #valgekast { width:738px; height:auto; background-color:#FFFFFF; } #logoimage { width:738px; height:169px; background-color:#990000; margin-top:0px; margin-left:0px; } #menyline { float:left; width:200px; height:auto; min-height:500px; background-color:#999900; } ul#nav { font-size : 12px; font-family:Tahoma; list-style:none; color:#FFFFFF; line-height:20px; text-decoration:none; } ul#nav li { font-size : 12px; font-family:Tahoma; list-style:none; color:#FFFFFF; line-height:20px; text-decoration:none; border-bottom-width:1px; border-bottom-color:#ffffff; border-bottom-style:dotted; } ul#nav li a { font-size : 12px; font-family:Tahoma; list-style:none; color:#FFFFFF; line-height:20px; text-decoration:none; } ul#nav li a:hover { font-size : 12px; font-family:Tahoma; list-style:none; color:#ffa200; line-height:20px; text-decoration:none; } #osa { background-color:#999900; width:738px; height:auto; min-height:500px; } #sisuplace { float:left; height:auto; width:300px; color:#FFFFFF; font-family:Verdana; font-size:12px; } #menu { width:200px; height:auto; min-height:2px; padding-left:0px; } #footer { width:738px; height:32px; background-color:#0066FF; color:#FFFFFF; text-align:right; font-size:24px; } .clear { clear: both; } </style> </head> <div id="logoimage">YLAOSA </div> <li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li> <li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li> <li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li><li><a href="" >Kontakt </a></li> </ul></div> </div><div id="sisuplace"> SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br>SEE SIIN ON SISU <br> </div><div class="clear"></div></div> <div id="footer">FOOTER </div> </div></div> </body> </html>
|
btw, sinu lingitud näiteleht on katki Fx3'ga, mitmel pool suurused paigast ära
viimati muutis mikk36 20.06.2008 12:01:25, muudetud 1 kord |
|
Kommentaarid: 85 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
2 :: |
78 |
|
tagasi üles |
|
 |
Renka
HV Guru

liitunud: 01.04.2002
|
20.06.2008 12:00:43
|
|
|
mikk36 kirjutas: |
Renka kirjutas: |
mikk36, proovisid hetkel ise järgi ka? See lahendus töötab XHTML'is ilusasti aga hetkel kiiruga firebugis proovides ma soovitud tulemust ei saanud (HTML 4 määranguga). |
avasin lingi, vaatasin mis lehel on, klikkisin firebugi ikooni peale ja asusin muutma (ehk siis lisasin menüüle float: left, keelasin ära position käsu ja siis lisasin #osa sisse ühe divi (edit käsuga) ja määrasin tolle stiiliks clear: both)
kõik
mingit salvestamist ega välist editori ma ei kasutanud
või on minu töövõtted valed ? |
Ei mitte töövõtted ei ole valed aga mul OSX ja FF3'ga samad töövõtted sellist tulemust ei andnud. Minuarust oli probleemiks HTML 4 Doctype.
Ja seal on kasutuses XHTML
Soovitan sul ka muuda doctype XHTMLiks ja siis ehita sealt edasi.
Minu kogemused näitavad, et sellega kaob ka eri brauserite (no IE on ikka vahest erand) vahelised probleemid ära - seda kõike muidugi kui kood valideerub.
_________________ There is no place like 127.0.0.1
viimati muutis Renka 20.06.2008 12:06:21, muudetud 1 kord |
|
Kommentaarid: 71 loe/lisa |
Kasutajad arvavad: |
   |
:: |
2 :: |
1 :: |
61 |
|
tagasi üles |
|
 |
mikk36
HV Guru

liitunud: 21.02.2004
|
20.06.2008 12:19:29
|
|
|
xhtml1.0 transitional annab kõige paremaid tulemusi IE'ga, kuigi ma eelistaksin stricti
|
|
Kommentaarid: 85 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
2 :: |
78 |
|
tagasi üles |
|
 |
Kethmar
Kreisi kasutaja

liitunud: 21.06.2006
|
20.06.2008 12:20:56
|
|
|
Ma ei tea, kas XHTML-iks saan muuta, sest TigerCMS võib asjad jälle tuksi keerata...sest seal paljud asjad ei valideeru.
Muide, kuidas XHTML-iks muuta ?
_________________ Kodulehekülg: http://kethmar.ee/university
Vajad veebilahendust või graafilist abi? Küsi pakkumist. HV Rahvale alati odavamalt. |
|
Kommentaarid: 24 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
24 |
|
tagasi üles |
|
 |
mikk36
HV Guru

liitunud: 21.02.2004
|
20.06.2008 12:35:27
|
|
|
1) muudad doctype ära
2) muudad tigercms's template'i ja kontrollid et seal oleks piisavalt uus fckeditor, mis väljastab xhtml1.0 standardset koodi (eeldusel et seal ikka see kasutusel)
edit: ma vist liiga tark hetkel ja ei suuda nagu leida tiger cms'i kodulehte, et kust seda üldse alla saaks laadida
|
|
Kommentaarid: 85 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
2 :: |
78 |
|
tagasi üles |
|
 |
Renka
HV Guru

liitunud: 01.04.2002
|
20.06.2008 13:31:29
|
|
|
mikk36, minuteada ei olegi see enam kättesaadav. Kunagi sai seda aadressilt: www.tiger.ee
_________________ There is no place like 127.0.0.1 |
|
Kommentaarid: 71 loe/lisa |
Kasutajad arvavad: |
   |
:: |
2 :: |
1 :: |
61 |
|
tagasi üles |
|
 |
Kethmar
Kreisi kasutaja

liitunud: 21.06.2006
|
20.06.2008 13:56:46
|
|
|
Jep, ise otsisin ka, ei olnud.
Kasutasin eelnevalt tehtud koduka faile, et TigerCMS tööle saada.
_________________ Kodulehekülg: http://kethmar.ee/university
Vajad veebilahendust või graafilist abi? Küsi pakkumist. HV Rahvale alati odavamalt. |
|
Kommentaarid: 24 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
24 |
|
tagasi üles |
|
 |
andrusny
Kreisi kasutaja

liitunud: 20.03.2006
|
20.06.2008 20:18:41
|
|
|
Kui veel hädas oled, siis see peaks toimima.
Mikul on tegelikult sarnane lahendus juba pakutud.
<style>
#konteiner {
position:relative;
border:solid 1px #000;
left:200px;
width:600px;
}
#vasak {
float:left;
background:#33FFCC;
width:200px;
}
#parem {
float:left;
background:#CCCCCC;
width:388px;
}
#all {
height:50px;
width:600px;
background:#CffCCC;
margin-top:5px;
clear:both;
}
</style>
<body>
<div id="konteiner">
<div id="vasak">Vasak kast</div>
<div id="parem" >Parem kast. <br><br><br>Siin on siis palju teksti </div>
<div id="all">rrr</div>
</div> |
_________________
 |
|
Kommentaarid: 7 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
7 |
|
tagasi üles |
|
 |
Kethmar
Kreisi kasutaja

liitunud: 21.06.2006
|
20.06.2008 21:03:14
|
|
|
Sain asja lahendatud. Teema võib kustutada ja suured tänud teile kõigile, aitasite mind JÄLLE hädast välja .
_________________ Kodulehekülg: http://kethmar.ee/university
Vajad veebilahendust või graafilist abi? Küsi pakkumist. HV Rahvale alati odavamalt. |
|
Kommentaarid: 24 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
24 |
|
tagasi üles |
|
 |
|