oarsFL
August 17, 2015 at 8:46 pm
Q 1. I have set 3 call to action boxes just below the menu bar on this page: http://test.oceanaddictionrecovery.com/about-us/our-mission/ . When you scroll down, this row of call to action disappears. Will I be able to make this static with Microthemer so it stays anchored on the top when you scroll down like the menu bar which is static.
Q 2. The topmost static bar which has the phone number and social icons http://test.oceanaddictionrecovery.com/about-us/our-mission/ http://www.detoxboca.com/
Hi there,
Yes to both. This is possible to do with CSS and therefore it is possible with Microthemer.
(I did actually respond to your email with this but perhaps it ended up in your spam folder?)
Answer 1
Install Microthemer (free trial will suffice) and go to the main UI editing page
Double-click on the grey area to the left of the 3 colored boxes.
Choose the following selector that Microthemer suggests (in the list on the right): div#post-177 div.et_pb_section_0
Name your selector Mission boxes Wrapper.
Click the CREATE SELECTOR button.
Go to the Position tab.
Set the position property to fixed.
Set z-index to 999.
Go to the Dimensions tab.
Set width to 100%.
You will then need to create another selector for the main content that does scroll (to overcome the overlapping issue that will present itself).
Double-click on the grey area to the left of the 3 colored boxes again.
This time click the Inspector tab of the selector wizard and click on the right arrow of the directional controls once.
Go back to the Targeting tab and choose the following selector that Microthemer suggests: div#post-177 div.et_pb_section_1
Name your selector Main Content
Click the CREATE SELECTOR button.
Go to the Padding & Margin tab.
Set the top padding to 200px.
That should be it!
Answer 2
Double-click the green area in the top bar (to the right of the text)
Choose the following selector that Microthemer suggests (in the list on the right):
div#top-header div.container
Name your selector Top bar.
Click the CREATE SELECTOR button.
Go to the Background tab.
Select an image to insert from your media library
Set some of the other background properties on this tab to suit you needs (e.g. no-repeat, position etc).
I hope that helps, please let me know if you have any further questions.
Cheers!
