Wy?wietlanie bloków TP niezgodne ze stylem

[Link]

Witam,

Mam pewien (chyba drobny) problem.

Otó?: zainstalowa?am na smf 1.1.11 TP 1.5.2 i styl Dogal. Na forum paski tytu?owe dzia?ów s? zaokr?glone, natomiast nag?ówki bloków i artyku?ów TP s? ostro zako?czone. Czy jest mo?liwo?? jako? to dopasowa???

www.latoma.net/new

Z góry dzi?kuj? - pozdrawiam Sandra

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Witam,

Mam pewien (chyba drobny) problem.

Otó?: zainstalowa?am na smf 1.1.11 TP 1.5.2 i styl Dogal. Na forum paski tytu?owe dzia?ów s? zaokr?glone, natomiast nag?ówki bloków i artyku?ów TP s? ostro zako?czone. Czy jest mo?liwo?? jako? to dopasowa???

www.latoma.net/new

Z góry dzi?kuj? - pozdrawiam Sandra

Pozdrawiam - Sandra
www.drlucy.pl
www.latoma.net

[Link]

Cze?? Sandro

Twój "(chyba drobny) problem", mo?na rozwi?za? na 2 sposoby,

1 - to narysowanie tych zaokr?glonych rogów.

2 - sposób to CSS3 które s? jeszcze w powijakach i nie wszystkie przegl?darki ..qmaj? co jest zgrane..

Zastosowa?em t? metod? tutaj, na tym forum, cho? stosuj? j? ró?nych miejscach sieci..
Pewnie pytasz, bo zobaczy?a? tutaj pozaokr?glane rogi? spoco,
- to miejsce g?. (po za pomoc? dla skryptu SMF, naturalnie), s?u?y równie? pokazywaniu mo?liwo?ci samego skryptu no i w ogóle co mo?na z tym zrobi?, wszak to jednocze?nie "Poligon"..

Sandro, podpowiem Ci co masz zrobi?, szczególnie ?e to TinyPortal, który bardzo dobrze znam.. i bardzo lubi?..

W samych stylach.css od tej skórki, tej klasy odpowiadaj?cej za blocki nie znajdziesz..  poszukaj gdzie indzie..

- w ./Theme/default znajduje si? plik tp-style.css lub podobnie (joke) oko?o lini ~1250 znajdziesz klasy od block'ów:

GeSHi -› Code: [select]

/*  
*******************************************************************************
this is where you set the distance between blocks, use padding and target each panel if you like
********************************************************************************
*/
.block_leftcontainer,
.block_rightcontainer,
.block_centercontainer,
.block_uppercontainer,
.block_lowercontainer,
.block_topcontainer,
.block_bottomcontainer
{
    padding-bottom: 4px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:258.12 KB/s

to trzeba zastosowa?, nie wspierana oficjalnie przez W3c - klas? border-radius, tylko, ?e..
- w takiej wersji zobaczy i wy?wietli poprawnie tylko i wy??cznie Opera,
- ?eby zobaczy? zaokr?glone rogi FF to musisz dopisa? przed: -moz-
- ?eby zobaczy?y przegl?darki typu Safari musisz doda? przed -webkid-
- przegl?darka Konqueror (to linuxowa zabawka i mo?na odpu?ci?), ale podaj?, dodajesz przed klas?: -khtml-
- IE to ostatni, ale za to komercyjny dupek i olej to, poniewa? trzeba u?y? specjalnej metody a i tak lipa..

Czasem lepiej narysowa? te zaokr?glone rogi.. Ale wiadomo ..wszystkim nie dogodzi..

Przy klasie border-radius podaje si? w px promie? i proponuje zasi?g do testowania od 5px do 9px nie ma co przesadza?..
Mi to wygl?da gdzie? na radius: 8px chyba nawet to b?dzie max, (przetestuj pó?niej na 6px),i tak Ci to podam,
a Ty sobie to ustaw, ?eby by?o podobnie jak masz na górze, okay?

Do tej, (podanej wy?ej) , klasy dopisz? radiusa..

taki przyk?ad z 8px:

GeSHi -› Code: [select]

/*  
*******************************************************************************
this is where you set the distance between blocks, use padding and target each panel if you like
********************************************************************************
*/
.block_leftcontainer,
.block_rightcontainer,
.block_centercontainer,
.block_uppercontainer,
.block_lowercontainer,
.block_topcontainer,
.block_bottomcontainer
{
    padding-bottom: 4px;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:337.97 KB/s

Pami?taj o tym, ?e te style s? globalne dla wszystkich skórek, które b?dziesz tam mie?,
- dlatego mo?e z tego kodu wytnij ten padding a ca?? reszt? dopisz lokalnie, czyli do stylu, którego u?ywasz.
hmm mog?a by? si? niechc?cy zdziwi?, gdyby? zmieni?a styl..

no dobrze.. czesz na ma?? drzemk? czy có?.. 

Dopasuj, rozmiarem promienia w px tak ?eby pasowa?o do tego co masz na górze strony.
Nie nale?y przegina? z ilo?ci?, poniewa? to obci??a procka odwiedzaj?cego i stronka mo?e troch? zwolni?.
ale najwi?cej obci??a stosowanie cieni pod tekstem..

Okay, mam nadziej?, ?e przez to, Twoja strona stanie si? pi?kniejsza

Pozdrawiam
roco

roco

Administrator

3wProducer

Imagination is more Important than Knowledge

Posty 679

 

[Link]

Cze?? Sandro

Twój "(chyba drobny) problem", mo?na rozwi?za? na 2 sposoby,

1 - to narysowanie tych zaokr?glonych rogów.

2 - sposób to CSS3 które s? jeszcze w powijakach i nie wszystkie przegl?darki ..qmaj? co jest zgrane..

Zastosowa?em t? metod? tutaj, na tym forum, cho? stosuj? j? ró?nych miejscach sieci..
Pewnie pytasz, bo zobaczy?a? tutaj pozaokr?glane rogi? spoco,
- to miejsce g?. (po za pomoc? dla skryptu SMF, naturalnie), s?u?y równie? pokazywaniu mo?liwo?ci samego skryptu no i w ogóle co mo?na z tym zrobi?, wszak to jednocze?nie "Poligon"..

Sandro, podpowiem Ci co masz zrobi?, szczególnie ?e to TinyPortal, który bardzo dobrze znam.. i bardzo lubi?..

W samych stylach.css od tej skórki, tej klasy odpowiadaj?cej za blocki nie znajdziesz..  poszukaj gdzie indzie..

- w ./Theme/default znajduje si? plik tp-style.css lub podobnie (joke) oko?o lini ~1250 znajdziesz klasy od block'ów:

GeSHi -› Code: [select]

/*  
*******************************************************************************
this is where you set the distance between blocks, use padding and target each panel if you like
********************************************************************************
*/
.block_leftcontainer,
.block_rightcontainer,
.block_centercontainer,
.block_uppercontainer,
.block_lowercontainer,
.block_topcontainer,
.block_bottomcontainer
{
    padding-bottom: 4px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:258.12 KB/s

to trzeba zastosowa?, nie wspierana oficjalnie przez W3c - klas? border-radius, tylko, ?e..
- w takiej wersji zobaczy i wy?wietli poprawnie tylko i wy??cznie Opera,
- ?eby zobaczy? zaokr?glone rogi FF to musisz dopisa? przed: -moz-
- ?eby zobaczy?y przegl?darki typu Safari musisz doda? przed -webkid-
- przegl?darka Konqueror (to linuxowa zabawka i mo?na odpu?ci?), ale podaj?, dodajesz przed klas?: -khtml-
- IE to ostatni, ale za to komercyjny dupek i olej to, poniewa? trzeba u?y? specjalnej metody a i tak lipa..

Czasem lepiej narysowa? te zaokr?glone rogi.. Ale wiadomo ..wszystkim nie dogodzi..

Przy klasie border-radius podaje si? w px promie? i proponuje zasi?g do testowania od 5px do 9px nie ma co przesadza?..
Mi to wygl?da gdzie? na radius: 8px chyba nawet to b?dzie max, (przetestuj pó?niej na 6px),i tak Ci to podam,
a Ty sobie to ustaw, ?eby by?o podobnie jak masz na górze, okay?

Do tej, (podanej wy?ej) , klasy dopisz? radiusa..

taki przyk?ad z 8px:

GeSHi -› Code: [select]

/*  
*******************************************************************************
this is where you set the distance between blocks, use padding and target each panel if you like
********************************************************************************
*/
.block_leftcontainer,
.block_rightcontainer,
.block_centercontainer,
.block_uppercontainer,
.block_lowercontainer,
.block_topcontainer,
.block_bottomcontainer
{
    padding-bottom: 4px;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:337.97 KB/s

Pami?taj o tym, ?e te style s? globalne dla wszystkich skórek, które b?dziesz tam mie?,
- dlatego mo?e z tego kodu wytnij ten padding a ca?? reszt? dopisz lokalnie, czyli do stylu, którego u?ywasz.
hmm mog?a by? si? niechc?cy zdziwi?, gdyby? zmieni?a styl..

no dobrze.. czesz na ma?? drzemk? czy có?.. 

Dopasuj, rozmiarem promienia w px tak ?eby pasowa?o do tego co masz na górze strony.
Nie nale?y przegina? z ilo?ci?, poniewa? to obci??a procka odwiedzaj?cego i stronka mo?e troch? zwolni?.
ale najwi?cej obci??a stosowanie cieni pod tekstem..

Okay, mam nadziej?, ?e przez to, Twoja strona stanie si? pi?kniejsza

Pozdrawiam
roco

[Link]

Hmmm...

albo co? ?le robi?, albo to nie to   dokona?am wpisów w tp-style.css i efekt ?aden

mo?e wklej? obrazek, ?eby by?o wiadomo o co mi chodzi

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Hmmm...

albo co? ?le robi?, albo to nie to   dokona?am wpisów w tp-style.css i efekt ?aden

mo?e wklej? obrazek, ?eby by?o wiadomo o co mi chodzi

[3.04 KB]

forum.PNG   -› 3.04 KB, 297x157 - wyświetlony 3885 razy



bloki.PNG   -› 11.3 KB, 295x107 - wyświetlony 3820 razy

[Link]

nie nie, jest ok, po prostu TP generuje dynamicznie swoje klasy..

Poka?? Ci to na fotkach..

Wie?, ?e doda?a? i masz tak:




To przyk?ad, o czym mówi?em w zwi?zku z innymi przegl?darkami:



Tak widzi tez zapis FireFox.. normalnie ta klasa to border-radius i podajesz wielko?? promienia w px
FF nie zobaczy? tego wszystkiego tylko to co by?o dla niego, czyli trzeba by?o doda? na pocz?tku: -moz-

Klasy bloków zosta?y dynamicznie, (czy te? virtualnie), wstawione do sekcji head co by?o widac w podgl?dzie strony:




Przyjrzyjmy si? teraz klasom, które ju? zosta?y wygenerowane dla przegl?darki:



Strza?kami zaznaczy?em interesuj?ce nas klasy.

Teraz przyjrzyjmy si? temu pierwszemu blokowi:

to jest w?a?nie klasa, o której mówi?em wcze?niej, czyli class = "block_leftcontainer"



Ale to nie on ma to "co?" co mo?na wizualnie zaokr?gli?..


Ma to to klasa diva poni?ej, ta klasa:



To dynamicznie i zale?nie od "sutuacji" jest generowana ta w?a?nie klasa: class = "tborder tp_leftblock_frame" i to o ni? w?a?nie chodzi..

Mo?na zobaczy? mechanizm w pliku: "TPsubs.template.php" (- powinien by? w stylu default..)

To jest kawa?ek kodu, który odpowiada, za dynamiczne przydzielanie klas, wszelkim blokom:

GeSHi -› Code: [select]

    // check
    if($block['var4']=='')
        $block['var4']=0;

    if($block['var4']==0)
        $block['var4'] = $context['TPortal']['panelstyle_'.$side];

    // its a normal block..
    if(in_array($block['frame'],array('theme','frame','title','none')))
    {
        echo '
    <div class="&#39;, (($theme || $block[&#39;frame&#39;]==&#39;frame&#39;) ? &#39;tborder tp_&#39;.$side.&#39;block_frame&#39; : &#39;tp_&#39;.$side.&#39;block_noframe&#39;), &#39;">&#39;;

        // show the frame and title
        if ($theme || $block[&#39;frame&#39;] == &#39;title&#39;)
        {
            echo $types[$block[&#39;var4&#39;]][&#39;code_title_left&#39;];

            if($block[&#39;visible&#39;]==&#39;&#39; || $block[&#39;visible&#39;]==&#39;1&#39;)
                echo &#39;<a href="javascript: void(0); return false" onclick="toggle(\&#39;&#39;.$block[&#39;id&#39;].&#39;\&#39;); return false"><img id="blockcollapse&#39;.$block[&#39;id&#39;].&#39;" style="margin: 0; " align="right" src="&#39; .$settings[&#39;tp_images_url&#39;]. &#39;/&#39; , !in_array($block[&#39;id&#39;],$context[&#39;TPortal&#39;][&#39;upshrinkblocks&#39;])  ? &#39;TPcollapse&#39; : &#39;TPexpand&#39; , &#39;.gif" border="0" alt="" title="&#39;.$txt[&#39;block-upshrink_description&#39;].&#39;" /></a>&#39;;

            // can you edit the block?

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.025s | speed:52.95 KB/s

Natomiast w podgl?dzie strony masz ju? gotowca, wygenerowan? klas?: tborder tp_leftblock_frame

Kod, z podgl?du:

GeSHi -› Code: [select]

    <div class="block_leftcontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_leftblock_frame"><h3 class="titlebg" style="margin: 0; padding: 5px;"><span class="header">Firma</span></h3>
        <div class="tp_leftblock_body" id="block8"><div class="windowbg"><div style="padding: 8px;"><div class="blockbody" style="overflow: auto;">
    <ul class="tp_catmenu">
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?page=4">O nas</a></li>
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?page=3">Misja i cele</a></li>
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?page=9">Baza szkoleniowa</a></li>
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?action=contact">Kontakt</a></li>
    </ul></div></div></div>
        </div>
    </div>
    </div>
    <div class="block_leftcontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_leftblock_frame"><h3 class="titlebg" style="margin: 0; padding: 5px;"><span class="header">Oferta szkoleniowa</span></h3>
    itd.. itd..

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.027s | speed:41.66 KB/s

Poznajesz? to Twój pierwszy od góry block. Natomiast "pojemnik" (div), z klas?, o której wcze?niej mówi?em jest wy?ej
 i dopiero w nim znajduje si? w?a?ciwy block z brzydkim i niepasuj?cym do reszty borderem..

GeSHi -› Code: [select]

    <div class="block_leftcontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_leftblock_frame">

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.015s | speed:6.95 KB/s

To by? block po lewej stronie, teraz dalej, z podgl?du strony wida?, ?e ten ?rodkowy, ma tak? klas?: class = "tborder tp_centerblock_frame"

Wygl?da podobnie jak w blockach po lewej, tylko inne nazewnictwo:

GeSHi -› Code: [select]

    <div class="block_centercontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_centerblock_frame"><h3 class="titlebg" style="margin: 0; padding: 5px;"><span class="header">Witamy</span></h3>
        <div class="tp_centerblock_body" id="block15"><div class="windowbg"><div style="padding: 8px;"><div class="blockbody" style="overflow: auto;"><div class="block_article">
    <div class="blockarticle render1">
        <div class="article_info">

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.018s | speed:23.28 KB/s

Czyli mamy ju? te dwie interesuj?ce nas klasy: tborder tp_leftblock_frame i tborder tp_centerblock_frame

W zasadzie to 4 klasy, po??czone w dwie, które dla tego zapisu, po??czymy w jedn?.. hmm wysz?o papalap, ale mam nadziej?, ?e nad??asz..

Oczywi?cie w stylach, w zapisie, nale?y klas? poprzedzi? kropk? ., co te? jest wzgl?dne..

Ta klasa wygl?da u Ciebie w tym stylu tak:

GeSHi -› Code: [select]

/* This is used on tables that should just have a border around them. */
.tborder {
    padding: 0px;
    border: solid 2px #F4F9F2;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:72.03 KB/s

Jak dla mnie troch? siermi?ga.. ju? mo?e (?) lepiej ten border wygl?da?by tak: border: double 3px #F4F9F2; przynajmniej spróbuj..

Ale najwa?niejsze to wnioski ko?cowe..

Podaj? zapis wynikaj?cy z powy?szych wniosków..

GeSHi -› Code: [select]

/*******************************************
    Hack na zaokr?glone rogi bloków by roco *
*******************************************/
.tborder .tp_centerblock_frame, .tborder .tp_leftblock_frame {
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:167.46 KB/s

Klasa "tborder" normalnie wyst?puje sobie sama, ale to w?a?nie taki "myk" czy inaczej warunek..

To co poda?em w ostatnim code css daj na samym pocz?tku style.css w stylu, którego u?ywasz.

Dopiera jesli dalej nie b?dzie rezultatów, to usu? po kropeczce z obu .tborder, albo napisz.. wstawimy to gdzie indziej..


Sandro, sorry, mia?em odpisa? par? godzin temu, ale jestem w rozjazdach i robi? sto rzeczy na raz..
Mam jednak nadziej?, ?e to napisa?em, przyda Ci si? na przysz?o??..


Dzia?anie jest proste, nale?y znale?? potrzebn? klas? odpowiadaj?c?, za interesuj?cy nas element i podda? obróbce,
ew. dopisa?, jak robimy teraz.. Zobacz takiej klasy w ogóle nie ma, a w podgl?dzie strony jest..
Wi?c przynajmniej jest si? czego trzyma?..

Pozdrawiam
roco

PS. pochwal, si?, kiedy Ci si? uda

roco

Administrator

3wProducer

Imagination is more Important than Knowledge

Posty 679

 

[Link]

nie nie, jest ok, po prostu TP generuje dynamicznie swoje klasy..

Poka?? Ci to na fotkach..

Wie?, ?e doda?a? i masz tak:




To przyk?ad, o czym mówi?em w zwi?zku z innymi przegl?darkami:



Tak widzi tez zapis FireFox.. normalnie ta klasa to border-radius i podajesz wielko?? promienia w px
FF nie zobaczy? tego wszystkiego tylko to co by?o dla niego, czyli trzeba by?o doda? na pocz?tku: -moz-

Klasy bloków zosta?y dynamicznie, (czy te? virtualnie), wstawione do sekcji head co by?o widac w podgl?dzie strony:




Przyjrzyjmy si? teraz klasom, które ju? zosta?y wygenerowane dla przegl?darki:



Strza?kami zaznaczy?em interesuj?ce nas klasy.

Teraz przyjrzyjmy si? temu pierwszemu blokowi:

to jest w?a?nie klasa, o której mówi?em wcze?niej, czyli class = "block_leftcontainer"



Ale to nie on ma to "co?" co mo?na wizualnie zaokr?gli?..


Ma to to klasa diva poni?ej, ta klasa:



To dynamicznie i zale?nie od "sutuacji" jest generowana ta w?a?nie klasa: class = "tborder tp_leftblock_frame" i to o ni? w?a?nie chodzi..

Mo?na zobaczy? mechanizm w pliku: "TPsubs.template.php" (- powinien by? w stylu default..)

To jest kawa?ek kodu, który odpowiada, za dynamiczne przydzielanie klas, wszelkim blokom:

GeSHi -› Code: [select]

    // check
    if($block[&#39;var4&#39;]==&#39;&#39;)
        $block[&#39;var4&#39;]=0;

    if($block[&#39;var4&#39;]==0)
        $block[&#39;var4&#39;] = $context[&#39;TPortal&#39;][&#39;panelstyle_&#39;.$side];

    // its a normal block..
    if(in_array($block[&#39;frame&#39;],array(&#39;theme&#39;,&#39;frame&#39;,&#39;title&#39;,&#39;none&#39;)))
    {
        echo &#39;
    <div class="&#39;, (($theme || $block[&#39;frame&#39;]==&#39;frame&#39;) ? &#39;tborder tp_&#39;.$side.&#39;block_frame&#39; : &#39;tp_&#39;.$side.&#39;block_noframe&#39;), &#39;">&#39;;

        // show the frame and title
        if ($theme || $block[&#39;frame&#39;] == &#39;title&#39;)
        {
            echo $types[$block[&#39;var4&#39;]][&#39;code_title_left&#39;];

            if($block[&#39;visible&#39;]==&#39;&#39; || $block[&#39;visible&#39;]==&#39;1&#39;)
                echo &#39;<a href="javascript: void(0); return false" onclick="toggle(\&#39;&#39;.$block[&#39;id&#39;].&#39;\&#39;); return false"><img id="blockcollapse&#39;.$block[&#39;id&#39;].&#39;" style="margin: 0; " align="right" src="&#39; .$settings[&#39;tp_images_url&#39;]. &#39;/&#39; , !in_array($block[&#39;id&#39;],$context[&#39;TPortal&#39;][&#39;upshrinkblocks&#39;])  ? &#39;TPcollapse&#39; : &#39;TPexpand&#39; , &#39;.gif" border="0" alt="" title="&#39;.$txt[&#39;block-upshrink_description&#39;].&#39;" /></a>&#39;;

            // can you edit the block?

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.025s | speed:52.95 KB/s

Natomiast w podgl?dzie strony masz ju? gotowca, wygenerowan? klas?: tborder tp_leftblock_frame

Kod, z podgl?du:

GeSHi -› Code: [select]

    <div class="block_leftcontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_leftblock_frame"><h3 class="titlebg" style="margin: 0; padding: 5px;"><span class="header">Firma</span></h3>
        <div class="tp_leftblock_body" id="block8"><div class="windowbg"><div style="padding: 8px;"><div class="blockbody" style="overflow: auto;">
    <ul class="tp_catmenu">
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?page=4">O nas</a></li>
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?page=3">Misja i cele</a></li>
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?page=9">Baza szkoleniowa</a></li>
        <li>&nbsp;&nbsp;
            <img src="tp-images/icons/TPdivider2.gif" alt="" />&nbsp;
            <a href="index.php?action=contact">Kontakt</a></li>
    </ul></div></div></div>
        </div>
    </div>
    </div>
    <div class="block_leftcontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_leftblock_frame"><h3 class="titlebg" style="margin: 0; padding: 5px;"><span class="header">Oferta szkoleniowa</span></h3>
    itd.. itd..

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.027s | speed:41.66 KB/s

Poznajesz? to Twój pierwszy od góry block. Natomiast "pojemnik" (div), z klas?, o której wcze?niej mówi?em jest wy?ej
 i dopiero w nim znajduje si? w?a?ciwy block z brzydkim i niepasuj?cym do reszty borderem..

GeSHi -› Code: [select]

    <div class="block_leftcontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_leftblock_frame">

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.015s | speed:6.95 KB/s

To by? block po lewej stronie, teraz dalej, z podgl?du strony wida?, ?e ten ?rodkowy, ma tak? klas?: class = "tborder tp_centerblock_frame"

Wygl?da podobnie jak w blockach po lewej, tylko inne nazewnictwo:

GeSHi -› Code: [select]

    <div class="block_centercontainer">
    <div style="margin-bottom: 4px;" class="tborder tp_centerblock_frame"><h3 class="titlebg" style="margin: 0; padding: 5px;"><span class="header">Witamy</span></h3>
        <div class="tp_centerblock_body" id="block15"><div class="windowbg"><div style="padding: 8px;"><div class="blockbody" style="overflow: auto;"><div class="block_article">
    <div class="blockarticle render1">
        <div class="article_info">

// Created by GeSHi 1.0.8.10 | code: -› [code=PHP] | load:0.018s | speed:23.28 KB/s

Czyli mamy ju? te dwie interesuj?ce nas klasy: tborder tp_leftblock_frame i tborder tp_centerblock_frame

W zasadzie to 4 klasy, po??czone w dwie, które dla tego zapisu, po??czymy w jedn?.. hmm wysz?o papalap, ale mam nadziej?, ?e nad??asz..

Oczywi?cie w stylach, w zapisie, nale?y klas? poprzedzi? kropk? ., co te? jest wzgl?dne..

Ta klasa wygl?da u Ciebie w tym stylu tak:

GeSHi -› Code: [select]

/* This is used on tables that should just have a border around them. */
.tborder {
    padding: 0px;
    border: solid 2px #F4F9F2;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:72.03 KB/s

Jak dla mnie troch? siermi?ga.. ju? mo?e (?) lepiej ten border wygl?da?by tak: border: double 3px #F4F9F2; przynajmniej spróbuj..

Ale najwa?niejsze to wnioski ko?cowe..

Podaj? zapis wynikaj?cy z powy?szych wniosków..

GeSHi -› Code: [select]

/*******************************************
    Hack na zaokr?glone rogi bloków by roco *
*******************************************/
.tborder .tp_centerblock_frame, .tborder .tp_leftblock_frame {
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:167.46 KB/s

Klasa "tborder" normalnie wyst?puje sobie sama, ale to w?a?nie taki "myk" czy inaczej warunek..

To co poda?em w ostatnim code css daj na samym pocz?tku style.css w stylu, którego u?ywasz.

Dopiera jesli dalej nie b?dzie rezultatów, to usu? po kropeczce z obu .tborder, albo napisz.. wstawimy to gdzie indziej..


Sandro, sorry, mia?em odpisa? par? godzin temu, ale jestem w rozjazdach i robi? sto rzeczy na raz..
Mam jednak nadziej?, ?e to napisa?em, przyda Ci si? na przysz?o??..


Dzia?anie jest proste, nale?y znale?? potrzebn? klas? odpowiadaj?c?, za interesuj?cy nas element i podda? obróbce,
ew. dopisa?, jak robimy teraz.. Zobacz takiej klasy w ogóle nie ma, a w podgl?dzie strony jest..
Wi?c przynajmniej jest si? czego trzyma?..

Pozdrawiam
roco

PS. pochwal, si?, kiedy Ci si? uda

[Link]

Dzi?ki Roco, ju? jest zdecydowanie lepiej.

Musia?am jeszcze uzupe?ni? klasy odpowiedzialne za wy?wietlanie t?a nag?ówka, bo by?yo "kanciaste" i wchodzi?o na zaokr?glenie ramki.

Teraz mam jeszcze pytanko, jak zrobi?, ?eby zaokr?glona by?a tylko góra t?a a dó? pozosta? "kanciasty"?

Poka?? na rysunku o co mi chodzi

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Dzi?ki Roco, ju? jest zdecydowanie lepiej.

Musia?am jeszcze uzupe?ni? klasy odpowiedzialne za wy?wietlanie t?a nag?ówka, bo by?yo "kanciaste" i wchodzi?o na zaokr?glenie ramki.

Teraz mam jeszcze pytanko, jak zrobi?, ?eby zaokr?glona by?a tylko góra t?a a dó? pozosta? "kanciasty"?

Poka?? na rysunku o co mi chodzi

[5.89 KB]

jest.PNG   -› 5.89 KB, 145x153 - wyświetlony 3784 razy



ma_byc.PNG   -› 3.95 KB, 141x144 - wyświetlony 3718 razy

[Link]

Ech, niby lepiej, ale kforum i kalendarz wygl?da byle jak chyba przedobrzy?am

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Ech, niby lepiej, ale kforum i kalendarz wygl?da byle jak chyba przedobrzy?am

Pozdrawiam - Sandra
www.drlucy.pl
www.latoma.net

[Link]

Sandro

Zajrza?em do Ciebie i zauwa?y?em efekty, jednak pozwól, ?e co? Ci powiem.

- doda?a? przecinek po .tborder, skutkiem czego - dos?ownie wszystko co zawiera tborder, a to jest g? okre?lenie borderów wszelkich tabelek, - b?dzie zaokr?glone.

Najwa?niejsze, ?e jest skutek, twojego dzia?ania na pliku style.css. Teraz powiem Ci jak zrobi? ?eby by?y zaokr?glone tylko górne rogi..
Tu te?, na tym forum, dosta?em rozp?dziochy i ot tak sobie pozaokr?gla?em wsio co popad?o hehe, ale to poprawi?..

Taki przyk?ad..

Mamy border-radius: 8px; i je?li tak zapiszemy, to 4 rogi b?d? mia?y zaokr?glenie o promieniu 8px ka?y

Oczywi?cie mo?na tym regulowa? przestrzennie, dos?ownie sferycznie, uzyskuj?c ró?ne efekty.
Przyk?ady masz w za??czniku, - tylko 2 górne rogi s? zaokr?glone, ale ka?dy inaczej, jak si? dobrze przyjrzysz..

Okay, jak zrobi?, ?eby tylko góra by?a zaokr?glona?

Mo?na to zapisac tak: (to przyk?ad pod Oper?, bez hacków pod inne browsery..)

GeSHi -› Code: [select]

.tborder .tp_leftblock_frame {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:52.77 KB/s

to tylko przyk?ad.. ale widac na nim, ?e mo?na radius odnie?? do konkretnych "rogów"
Tak samo robimy dopisuj?c hucki dla innych przegl?darek, to nie oszcz?dzaj, dorób to dla innych browserów.. i zapomnij o IE

Ten przyk?adowy kod mo?na zapisa? w inny sposób:

GeSHi -› Code: [select]

.tborder .tp_leftblock_frame {
    border-radius: 8px 8px 0 0;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:33.85 KB/s

Co dok?adnie oznacza, - lewy róg - radius = 8px. prawy róg radius = 8px, a dolne oba rogi, nie posiadaj? ?adnego radiusa..

Musisz wzi?? poprawk? na to, ?e w takiej ramce komórki tabeli, jest jeszcze co?, co równie? by? mo?e wymaga takiego samego zaokr?glenia,
dla osi?gni?cia lepszej hmm g?adko?ci?

Sandro, ja proponuj?, w tych klasach spróbowa?, wychlasta? border, bo i tak osi?gniesz zaokr?glenie, i b?dzie efekt, jakby to by?a grafika.. a nie ramka..

Na pewno nie mo?e tam by? przecinka po .tborder.. to celowe dzia?anie, w zasadzie mo?na rzec - warunek..

Spróbuj z takim zapisem:

GeSHi -› Code: [select]

/*******************************************
    Hack na zaokr?glone rogi bloków by roco *
*******************************************/
.tborder .tp_centerblock_frame, .tborder .tp_leftblock_frame {
    border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    -khtml-border-radius: 8px 8px 0 0;
    border:none;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:167.32 KB/s

Jak widzisz to podobnie jak z innymi elementami w stylach, z t? ró?nic?, ?e nie zaczyna si? od górnego boku, tylko od górnego lewego rogu.. easy..

Ew. co? mo?na pokombinowa? z tym borderem, ma go tam nie by?, tzn. najpierw sobie zobacz jak to wygl?da..
Chodzi o to, ?eby by?o podobnie w cz??ci forum.. mo?e nie to samo, ale podobnie w znaczeniu zaokr?gle?.. tak s?dz?..

Sandro najpierw to zrób, sprawd? czy wsio dzia?a po Twojej my?li, a pó?niej dopiero pogadajmy ju? o ostatecznym wygl?dzie, okay?

Pozdrawiam
roco

roco

Administrator

3wProducer

Imagination is more Important than Knowledge

Posty 679

 

[Link]

Sandro

Zajrza?em do Ciebie i zauwa?y?em efekty, jednak pozwól, ?e co? Ci powiem.

- doda?a? przecinek po .tborder, skutkiem czego - dos?ownie wszystko co zawiera tborder, a to jest g? okre?lenie borderów wszelkich tabelek, - b?dzie zaokr?glone.

Najwa?niejsze, ?e jest skutek, twojego dzia?ania na pliku style.css. Teraz powiem Ci jak zrobi? ?eby by?y zaokr?glone tylko górne rogi..
Tu te?, na tym forum, dosta?em rozp?dziochy i ot tak sobie pozaokr?gla?em wsio co popad?o hehe, ale to poprawi?..

Taki przyk?ad..

Mamy border-radius: 8px; i je?li tak zapiszemy, to 4 rogi b?d? mia?y zaokr?glenie o promieniu 8px ka?y

Oczywi?cie mo?na tym regulowa? przestrzennie, dos?ownie sferycznie, uzyskuj?c ró?ne efekty.
Przyk?ady masz w za??czniku, - tylko 2 górne rogi s? zaokr?glone, ale ka?dy inaczej, jak si? dobrze przyjrzysz..

Okay, jak zrobi?, ?eby tylko góra by?a zaokr?glona?

Mo?na to zapisac tak: (to przyk?ad pod Oper?, bez hacków pod inne browsery..)

GeSHi -› Code: [select]

.tborder .tp_leftblock_frame {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:52.77 KB/s

to tylko przyk?ad.. ale widac na nim, ?e mo?na radius odnie?? do konkretnych "rogów"
Tak samo robimy dopisuj?c hucki dla innych przegl?darek, to nie oszcz?dzaj, dorób to dla innych browserów.. i zapomnij o IE

Ten przyk?adowy kod mo?na zapisa? w inny sposób:

GeSHi -› Code: [select]

.tborder .tp_leftblock_frame {
    border-radius: 8px 8px 0 0;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:33.85 KB/s

Co dok?adnie oznacza, - lewy róg - radius = 8px. prawy róg radius = 8px, a dolne oba rogi, nie posiadaj? ?adnego radiusa..

Musisz wzi?? poprawk? na to, ?e w takiej ramce komórki tabeli, jest jeszcze co?, co równie? by? mo?e wymaga takiego samego zaokr?glenia,
dla osi?gni?cia lepszej hmm g?adko?ci?

Sandro, ja proponuj?, w tych klasach spróbowa?, wychlasta? border, bo i tak osi?gniesz zaokr?glenie, i b?dzie efekt, jakby to by?a grafika.. a nie ramka..

Na pewno nie mo?e tam by? przecinka po .tborder.. to celowe dzia?anie, w zasadzie mo?na rzec - warunek..

Spróbuj z takim zapisem:

GeSHi -› Code: [select]

/*******************************************
    Hack na zaokr?glone rogi bloków by roco *
*******************************************/
.tborder .tp_centerblock_frame, .tborder .tp_leftblock_frame {
    border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    -khtml-border-radius: 8px 8px 0 0;
    border:none;
}

// Created by GeSHi 1.0.8.10 | code: -› [code=CSS] | load:0.002s | speed:167.32 KB/s

Jak widzisz to podobnie jak z innymi elementami w stylach, z t? ró?nic?, ?e nie zaczyna si? od górnego boku, tylko od górnego lewego rogu.. easy..

Ew. co? mo?na pokombinowa? z tym borderem, ma go tam nie by?, tzn. najpierw sobie zobacz jak to wygl?da..
Chodzi o to, ?eby by?o podobnie w cz??ci forum.. mo?e nie to samo, ale podobnie w znaczeniu zaokr?gle?.. tak s?dz?..

Sandro najpierw to zrób, sprawd? czy wsio dzia?a po Twojej my?li, a pó?niej dopiero pogadajmy ju? o ostatecznym wygl?dzie, okay?

Pozdrawiam
roco

[7.72 KB]

radius1.jpg   -› 7.72 KB, 210x51 - wyświetlony 2280 razy



radius3.jpg   -› 25.35 KB, 586x86 - wyświetlony 3716 razy

[Link]

Roco, doda?am przecinek, bo jak go nie ma, to zaokr?glony jest tylko ?rodkowy blok.

Teraz efekt jest dok?adnie taki o jaki mi chodzi?o - bardzo dzi?kuj? za pomoc.

Je?li masz jakie? sugestie odno?nie ostatecznego wygl?du to ch?tnie pos?ucham

Pozdrawiam - Sandra

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Roco, doda?am przecinek, bo jak go nie ma, to zaokr?glony jest tylko ?rodkowy blok.

Teraz efekt jest dok?adnie taki o jaki mi chodzi?o - bardzo dzi?kuj? za pomoc.

Je?li masz jakie? sugestie odno?nie ostatecznego wygl?du to ch?tnie pos?ucham

Pozdrawiam - Sandra

Pozdrawiam - Sandra
www.drlucy.pl
www.latoma.net

[Link]

Sandro

Jest w sumie hmm wzgl?dnie ok.. Ja bym powalczy? z ramkami w blokach, tj usun?? bym zewn?trzne i da? wewn?trz, wtedy zawarto?? boxa by?aby oramkowana, a nag?ówek mia? tylko zaokr?glone rogi.. Trzeba troch? przysi??? nad tymi klasami w stylach i pobawi? si? z godzink?..

Mówi?em o tym, ?e kiedy pierwszy etap masz za sob? to warto rozwa?y? inne rzeczy..

np. ?eby by?o smooth, zamiast wewn?trz kanciasto.., a na zewn?trz na okr?g?o..



to s? przyk?ady mo?liwo?ci:



Mo?na te? fajnie pobawi? si? obrazkami do bodrera, przyk?ad:



itd..

Sandro, troch? si? naszuka?em w zak?adkach, ale prosz? specjalnie dla Ciebie
- Specyfikacjia border-radius (uwaga to CSS-3 a nie obowi?zuj?ce: CSS-2.1):
Spec. - Border-Radius - CSS3

Tam masz z przyk?adami i rysunkami, podane w bardzo przejrzysty sposób, - co do czego i jak..

Oczywi?cie, jak masz pytania to zapraszam, tylko troch? ci?gle jestem zaj?ty i nie udaje mi si? chwilowo
- odpowiadac od razu, okay?

Pozdrawiam
roco

roco

Administrator

3wProducer

Imagination is more Important than Knowledge

Posty 679

 

[Link]

Sandro

Jest w sumie hmm wzgl?dnie ok.. Ja bym powalczy? z ramkami w blokach, tj usun?? bym zewn?trzne i da? wewn?trz, wtedy zawarto?? boxa by?aby oramkowana, a nag?ówek mia? tylko zaokr?glone rogi.. Trzeba troch? przysi??? nad tymi klasami w stylach i pobawi? si? z godzink?..

Mówi?em o tym, ?e kiedy pierwszy etap masz za sob? to warto rozwa?y? inne rzeczy..

np. ?eby by?o smooth, zamiast wewn?trz kanciasto.., a na zewn?trz na okr?g?o..



to s? przyk?ady mo?liwo?ci:



Mo?na te? fajnie pobawi? si? obrazkami do bodrera, przyk?ad:



itd..

Sandro, troch? si? naszuka?em w zak?adkach, ale prosz? specjalnie dla Ciebie
- Specyfikacjia border-radius (uwaga to CSS-3 a nie obowi?zuj?ce: CSS-2.1):
Spec. - Border-Radius - CSS3

Tam masz z przyk?adami i rysunkami, podane w bardzo przejrzysty sposób, - co do czego i jak..

Oczywi?cie, jak masz pytania to zapraszam, tylko troch? ci?gle jestem zaj?ty i nie udaje mi si? chwilowo
- odpowiadac od razu, okay?

Pozdrawiam
roco

[Link]

Wielkie dzi?ki Roco za pomoc i po?wi?cony czas.

Jutro sobie poczytam i ew. jeszcze poeksperymentuj? (chocia? jak wiesz nie lubi? ulepsza? dobrego - chyba ?e przestaje by? dobre )

Pozdrawiam i ?ycz? dobrej nocki - Sandra

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Wielkie dzi?ki Roco za pomoc i po?wi?cony czas.

Jutro sobie poczytam i ew. jeszcze poeksperymentuj? (chocia? jak wiesz nie lubi? ulepsza? dobrego - chyba ?e przestaje by? dobre )

Pozdrawiam i ?ycz? dobrej nocki - Sandra

Pozdrawiam - Sandra
www.drlucy.pl
www.latoma.net

[Link]

Po?wiczy?am troch?, przenios?am wpisy z pliku stule.css do tp-style.css i jest lepiej.

Pozosta?y do wyeliminowania dwa problemy, próbowa?am sama, ale chyba nie dam rady ):

1. zaokr?glone jest t?o nag?ówków na forum (temat, zacz?ty przez, odpowiedzi itp)
2. strona z formularzem kontaktowym wy?wietla si? bez ramek

Poka?? to ma rysunkach

Sandra

Global Moder

Mi?o?niczka psów

La Toma Magic

Posty 181

 

[Link]

Po?wiczy?am troch?, przenios?am wpisy z pliku stule.css do tp-style.css i jest lepiej.

Pozosta?y do wyeliminowania dwa problemy, próbowa?am sama, ale chyba nie dam rady ):

1. zaokr?glone jest t?o nag?ówków na forum (temat, zacz?ty przez, odpowiedzi itp)
2. strona z formularzem kontaktowym wy?wietla si? bez ramek

Poka?? to ma rysunkach

[4.99 KB]

forum.PNG   -› 4.99 KB, 291x140 - wyświetlony 3171 razy



kontakt.PNG   -› 10.01 KB, 366x370 - wyświetlony 3726 razy

[Link]

Sandro

Jednak nie rozumiem co jest tym problemem? - brak ramki w formularzu? i zaokr?glanie si? nag?ówków w g?. indexie dzia?ow?

W formularzu, to wiesz edycja pliku hmm jak mu tam? "formularz.template.php"? je?li jest templatka od niego, to dodajesz klas? tborder, lub direct gdzie masz t? tabel? formularza, to dodajesz bordery tam gdzie trzeba, czyli do komórek, ale tylko zewn?trzne.
Natomiast w g?. indexie, to proste, stylujesz podobnie jak w formularzu, czyli lokalnie w pliku BoardIndex.template.php i je?li nie ma tego pliku w tym konkretnym stylu, to easy, kopiujesz go tam ze stylu default a nast?pnie obrabiasz.
Wystarczy ?e dasz border-radius:0; i go wyzerujesz..

Sandro je?li dobrze zrozumia?em problem, to edycja lokalna mo?e pomóc, a nie globalnie w stylach.css, poniewa? wp?ywa to na inne elementy jak wida?..

Pozdrówka
roco

PS. je?li dalej problem, lub cos niejasne, to pisz, ew. wyklaruj swoje pytania, o ile nie zajarzy?em..

roco

Administrator

3wProducer

Imagination is more Important than Knowledge

Posty 679

 

[Link]

Sandro

Jednak nie rozumiem co jest tym problemem? - brak ramki w formularzu? i zaokr?glanie si? nag?ówków w g?. indexie dzia?ow?

W formularzu, to wiesz edycja pliku hmm jak mu tam? "formularz.template.php"? je?li jest templatka od niego, to dodajesz klas? tborder, lub direct gdzie masz t? tabel? formularza, to dodajesz bordery tam gdzie trzeba, czyli do komórek, ale tylko zewn?trzne.
Natomiast w g?. indexie, to proste, stylujesz podobnie jak w formularzu, czyli lokalnie w pliku BoardIndex.template.php i je?li nie ma tego pliku w tym konkretnym stylu, to easy, kopiujesz go tam ze stylu default a nast?pnie obrabiasz.
Wystarczy ?e dasz border-radius:0; i go wyzerujesz..

Sandro je?li dobrze zrozumia?em problem, to edycja lokalna mo?e pomóc, a nie globalnie w stylach.css, poniewa? wp?ywa to na inne elementy jak wida?..

Pozdrówka
roco

PS. je?li dalej problem, lub cos niejasne, to pisz, ew. wyklaruj swoje pytania, o ile nie zajarzy?em..

[Wy?wietlanie bloków TP niezgodne ze stylem]

Code: [select]  -› [ Topic: Wy?wietlanie bloków TP niezgodne ze stylem ]

[Wy?wietlanie bloków TP niezgodne ze stylem]

Code: [select]  -› [ Topic: Wy?wietlanie bloków TP niezgodne ze stylem ]