+ ÅäÔÇÁ ãæÖæÚ ÌÏíÏ
ÇáäÊÇÆÌ 1 Åáì 2 ãä 2
  1. #1
    Status
    Offline
    ÇáÕæÑÉ ÇáÑãÒíÉ Rise Company
    Engineering and Technology
    ÊÇÑíÎ ÇáÊÓÌíá
    Apr 2014
    ÇáÏæáÉ
    Egypt
    ÇáãÔÇÑßÇÊ
    4,612
    ãÚÏá ÊÞííã ÇáãÓÊæì
    10

    ÇÝÊÑÇÖí ææÑÏÈÑíÓ Wordpress ÚßÓ ÇáÊÑÊíÈ Úáì ÇáãæÈÇíá Reverse column stacking order


    ææÑÏÈÑíÓ Wordpress ÚßÓ ÇáÊÑÊíÈ Úáì ÇáãæÈÇíá Reverse column stacking order
    Columns ordering on devices - WP Bakery Column Stacking / Display Order
    swap columns in visual composer on mobile responsive
    Stacking Columns Problems When Using WP Bakery Builder




    Add display:flex to your row and then, with media queries, in mobile add flex-direction:column-reverse to the same row. It will reverse the column order and so the one that is on right in desktop will move up, and the one on the left will move down.
    display:flex you can add it before mobile ( in general styles ) or just in mobile version when you need to add also flex-direction:column-reverse
    See example below or jsfiddle

    ßæÏ:
    @media handheld, only screen and (max-width: 767px){
        .vc_row.element-row.row {
            position: relative;
            flex-direction: column-reverse;
            display: flex;
        }
    }
    Çæ

    ßæÏ:
    /*reverse row in desktop*/
    @media only screen and (min-width: 1001px) {   
     .reverse-row >.col.span_12 {        
    flex-direction: row-reverse !important;  
      }
    }
    Çæ

    ßæÏ:
    @media all and (max-width:800px){
    .reverse-cols .fusion-row {
    display: flex;
    flex-flow: wrap;
    flex-direction: column-reverse;}}
    Çæ


    ßæÏ:
    @media screen and (max-width: 800px) {
        .fusion-row { display: flex; flex-flow: column; }
        .fusion-column-last { order: 1}
        .fusion-column-first { order: 2}
    }
    Íá ÇÎÑ

    Duplicate the row that has the 1/4 + 3/4 containers. Set the original to display on medium and large screens only. Set the duplicate to only display on small screens and drag your 3/4 container to the left of the 1/4 container so it’s a row of 3/4 + 1/4.


    ------------------------------------------------------------------------
    ÔÑßÉ ÑÇíÒ ááåäÏÓÉ æ ÇáÊßäæáæÌíÇ Rise Company for Engineering & Technology
    ------------------------------------------------------------------------
    Web Hosting | Web Designing | E-Marketing

    ÑÞã # 1 Ýì ÎÏãÇÊ ÇáÔÑßÇÊ Business Services

    ÇÓÊÖÇÝÉ ãæÇÞÚ Web Hosting - Úãá Çíãíá ÔÑßÉ Business Emails

    ÊÕãíã ãæÞÚ ÔÑßÉ Web Design - ÊÓæíÞ ÇáßÊÑæäì Úáì ÌæÌá Google Adwords

    www.rise.company | www.rise.company/emails

    ãáÍæÙÉ : ÌãíÚ ÎÏãÇÊäÇ ãÎÕÕÉ ááÔÑßÇÊ ÝÞØ æÛíÑ ãÊÇÍÉ ááÇÝÑÇÏ
    æáíÓ áäÇ Çì ãäÊÌÇÊ Çæ ÕíÇäÉ äåÇÆíÇ! íÑÌì ÇáÇäÊÈÇå Çáì Ðáß.



  2. #2
    Status
    Offline
    ÇáÕæÑÉ ÇáÑãÒíÉ äÇÑãíä
    ÚÖæ
    ÊÇÑíÎ ÇáÊÓÌíá
    Mar 2020
    ÇáÏæáÉ
    Algeria
    ÇáãÔÇÑßÇÊ
    3
    ãÚÏá ÊÞííã ÇáãÓÊæì
    0

    ÇÝÊÑÇÖí ÑÏ: ææÑÏÈÑíÓ Wordpress ÚßÓ ÇáÊÑÊíÈ Úáì ÇáãæÈÇíá Reverse column stacking order

    ÔßÑÇ ÌÒíáÇ Úáì ÇáÊæÖíÍ æÇáÔÑÍ

ÇáãæÇÖíÚ ÇáãÊÔÇÈåå

  1. ææÑÏÈÑíÓ Wordpress ÇáÇÎÝÇÁ Ýí Elementor Page Builder
    ÈæÇÓØÉ Rise Company Ýí ÇáãäÊÏì ÞÓã ææÑÏÈÑíÓ WordPress
    ãÔÇÑßÇÊ: 0
    ÂÎÑ ãÔÇÑßÉ: 01-02-2020, 00:49
  2. ææÑÏÈÑíÓ Wordpress ÇÎÝÇÁ how to hide protected by reCAPTCHA
    ÈæÇÓØÉ Rise Company Ýí ÇáãäÊÏì ÞÓã ææÑÏÈÑíÓ WordPress
    ãÔÇÑßÇÊ: 0
    ÂÎÑ ãÔÇÑßÉ: 22-01-2020, 11:40
  3. ææÑÏÈÑíÓ Wordpress ÇÖÇÝÉ ÊÚÑíÈ ÇáãæÇÞÚ Wpml ÔÑÍ ÇáÊËÈíÊ Çæá ãÑÉ
    ÈæÇÓØÉ Rise Company Ýí ÇáãäÊÏì ÞÓã ææÑÏÈÑíÓ WordPress
    ãÔÇÑßÇÊ: 0
    ÂÎÑ ãÔÇÑßÉ: 16-11-2019, 01:33
  4. ÇÖÇÝÉ ÊÚÑíÈ / ÊÑÌãÉ ãæÇÞÚ ÇáææÑÏÈÑíÓ Wpml Wordpress Multilingual
    ÈæÇÓØÉ Rise Company Ýí ÇáãäÊÏì ÞÓã ææÑÏÈÑíÓ WordPress
    ãÔÇÑßÇÊ: 0
    ÂÎÑ ãÔÇÑßÉ: 16-11-2019, 01:06
  5. ææÑÏÈÑíÓ wordpress ÑÓÇÆá ÇÓ Çã ÇÓ smsglobal ÇÖÇÝÉ WP SMS
    ÈæÇÓØÉ Rise Company Ýí ÇáãäÊÏì ÞÓã ææÑÏÈÑíÓ WordPress
    ãÔÇÑßÇÊ: 0
    ÂÎÑ ãÔÇÑßÉ: 19-09-2019, 16:22

ÇáãÝÖáÇÊ

ÇáãÝÖáÇÊ

ÖæÇÈØ ÇáãÔÇÑßÉ

  • áÇ ÊÓÊØíÚ ÅÖÇÝÉ ãæÇÖíÚ ÌÏíÏÉ
  • áÇ ÊÓÊØíÚ ÇáÑÏ Úáì ÇáãæÇÖíÚ
  • áÇ ÊÓÊØíÚ ÅÑÝÇÞ ãáÝÇÊ
  • áÇ ÊÓÊØíÚ ÊÚÏíá ãÔÇÑßÇÊß
  •