Position of elements in real time

This topic contains 6 replies, has 2 voices, and was last updated by  0be1 5 years, 7 months ago.

Author Posts

0be1

So I have taken the plunge and gone full in and committed to the Microtheme family for my building skills (wish I would have done it sooner). Still have a loooong ways to go in my learning skills and many obstacles to overcome. One of the things that are frustrating me (and I am sure I am my own enemy) is this.

I get text laid out just the way I want it in the large desktop view and then switch to another tab that does not have the plugin running and the text does not line up exactly like it shows in the microtheme plugin. It is off by quite a bit actually. Can someone please give me a few pointers as to what I am doing wrong of if there will be some future documentation, how-to’s, or videos coming out.

Also, for a feature request, I wish the tool bar was dockable and movable. Sometimes it gets in the way of development. Other than that, I am learning lots and having fun with my development and I hope to be up to speed soon to be able to help others in the future.

tia…

Shawn


Sebastian

Hey Shawn,

Welcome to the family!

My first thoughts are that your styles do not apply in the desired way across the range of screen sizes specified by the Large Desktop media query. Microthemer defaults to the min/max screen width of your media queries. So on the Large Desktop – @media (min-width: 1200px) media query, it defaults to 1200px.

But look at the rulers. The dark shading reveals the scope of the media query (1200px and up). You can drag the horizontal ruler to the right, and you may see the same thing you see on the other non-Microthemer tab. If so, you might need to apply your styling in a different way. Or under some circumstances, add an extra media query using the options next to the responsive tabs.

If you wouldn’t mind posting a link to your site, I can advise you more specifically.

When I say ‘apply your styling in a different way’ I mean like specifying dimensions using percentage units (%) rather than a plain number that is output as pixels e.g. 400px. This tutorial will teach you all about responsive design, and CSS generally.

Regarding docking the toolbar, you can click the MT logo at the top left to temporarily hide it. And in an upcoming release (due at the end of the month) the selector wizard will be dockable to the footer. It currently reduces the width of the screen when it appears on the right, which isn’t ideal for responsive design.

Cheers,
Sebastian


0be1

Good morning from the U.S. Sebastian!!!

Raining here, but we need it. The link to the current site I am working on is alarrl.dixiehammers.com

Thank you for the quick reply!! Much appreciated!! :o)

Cheers…

Shawn

P.S. Getting backwards on mobile too, but we’ll get there as well


Sebastian

Thanks for that Shawn, so which text aligns well in MT but not on an outside tab?


0be1

Can you send me one of those private links for you to log in to see the layout in MT so you can see it in MT where the text is in one tab in the browser, and then in another tab see it live without MT. Then you will see what I mean.


Sebastian

Sounds good. Please via our secure contact form: https://themeover.com/support/contact/

Thanks,
Sebastian


0be1

Submitted

You must login or register to reply to this topic.