I have 3 columns in one row in WP with Elementor. I need the last one align to right, when mobile layout is active.
I tried all settings for it, but blind path for me :).
Can you help me how please? Thank you
Pavel
you could try to duplicate the last column, then select the left column and hide it on mobile using the responsive options. You can find them in the advanced settings tab. On desktop and tablet, hide the duplicated column instead.
Related
I've designed a Light store website by using elementor. I need to arrange the features section in one line like Desktop view. on mobile view mobile view this is the default. I tried to do it by adjusting the margin it's not working properly.
How to do that?
Just click on column settings as marked in the screenshot. After that assign column width to 20 as shown in the screenshot2. You have to do this for all columns but before this set mobile view in Elementor.
screenshot
screenshot2
I'm having issues with this plugin. I'm trying to convert 3 columns to 2 columns for responsiveness in smaller devices. When ever I change the 3 columns to 2 columns from the responsive tab, it pushes the 4th item into third row. Not only that they are not positioned properly either.
This screenshot will help:
You can submit page content in VIsual Composer??
I am looking to recreate this type of view for a list of 'offers' as groupons have when you visit the site on mobile:
As we can see they seem to be using a new unordered list item for each offer box, and then the offer itself is contained within a single list item, which has a link, image, header, and a table for the details about the bottom. This looks good and seems to work nicely.
I want to recreate this using bootstrap - in such a way that when I then view the layout on my desktop, the site scales up and perhaps new fields / details which were not visible in the example above suddenly become visible.
here, they are using tables. But, It is the old way, you can redesign itself with bootstrap. The only thing you should know is bootstrap.
they have a great documentation of their classes and what they do.
for example:- if you need an element to disappear in mobiles and appear in tabs and machines, you can use .sm-hidden class.
Give it a try.
I have a wordpress site which is responsive. In my home page there is a slider (responsive slider) Now i need to add some content below the slider with a small image and a one sentence description. There will be 3rows, in 1st row i need 3 images with 3 small descriptions , in 2nd and 3rd row 2images with descriptions. I need to make these responsive. Images and the small description should be responsive. I tried so many ways , but nothing works. Can anyone help me please?
Responsive layout design is 99.9% to do with your css and how you're writing it. Can you post any code examples? What theme are you using?
Some theme designers like Woothemes provide shortcodes for adding columns and rows of content that work responsively out of the box.
It's impossible to help any further until you provide more information :-)
sorry for asking as I hate asking questions but sometimes its the last resort.
I am pulling my hair out over here and I have read hundreds of pages over the weekend and just can't get my head around how to do achieve this.
I want to have a simple 4 column 'home' landing page for desktop and ipad (sub pages will revert to 2 columns - content and sidebar). When the user goes on to a iPhone I want the user to see 2 columns.
I have managed to either get the iphone to display a scaled down version of the 4 columns using the grid system or I have managed to get it displaying 1 column, neither of which help me.
I have attached an image of what I am trying to achieve if it helps but I would really appreciate if someone who has had some experience in this field to point me in the right direction as I just cant figure it out.
I am developing using wordpress and have tried bootstrap, responsive theme and bones and getting the same results with each. Each using a responsive fluid grid. I may be barking up the wrong tree but if someone could point me in the right direction I would appreciate it.
You need to use CSS media queries, based on screen size / device width.
This will allow your CSS to style the widths of columns on each device...
http://www.htmlgoodies.com/beyond/css/introduction-to-css-media-queries.html
Current versions of Adobe Dreamweaver now also support what are called "Fluid Grid Layouts" which are worth a look for this kind of issue. They are also very helpful for quickly solving inter-device layout issues. You can design easily for Mobile, Tablet, and Desktop in one interface!