Recreating an effect from Be Webinar on my own Betheme installation.

Hello, can you please tell me how you achieved something as I am trying to recreate it on another betheme theme.  I want to recreate the light blue box with signature found on the about page of the BeWebinar theme. I have done everything so far but can not achieve the padding to the left which pushes the box over to a more central position. Can you please tell me how you did it?

Comments

  • Hey,
    I have exported this section for you. Import this in your Muffin Builder on a new page for testing
    YToxOntpOjA7YTozOntzOjM6InVpZCI7czo5OiI4MTUwZjg4YTUiO3M6NDoiYXR0ciI7YToxODp7czo1OiJ0aXRsZSI7czowOiIiO3M6ODoiYmdfY29sb3IiO3M6NzoiIzdiNmU2MSI7czo4OiJiZ19pbWFnZSI7czo5NDoiaHR0cHM6Ly90aGVtZXMubXVmZmluZ3JvdXAuY29tL2JlL3dlYmluYXIvd3AtY29udGVudC91cGxvYWRzLzIwMTkvMDgvd2ViaW5hci1hYm91dC1taWNoYWVsLmpwZyI7czoxMToiYmdfcG9zaXRpb24iO3M6MzI6Im5vLXJlcGVhdDtjZW50ZXIgdG9wO2ZpeGVkO2NvdmVyIjtzOjc6ImJnX3NpemUiO3M6NToiY292ZXIiO3M6MTI6ImJnX3ZpZGVvX21wNCI7czowOiIiO3M6MTI6ImJnX3ZpZGVvX29ndiI7czowOiIiO3M6MTE6InBhZGRpbmdfdG9wIjtzOjM6IjEwMCI7czoxNDoicGFkZGluZ19ib3R0b20iO3M6MzoiMTAwIjtzOjc6ImRpdmlkZXIiO3M6MDoiIjtzOjk6ImRlY29yX3RvcCI7czowOiIiO3M6MTI6ImRlY29yX2JvdHRvbSI7czowOiIiO3M6MTA6Im5hdmlnYXRpb24iO3M6MDoiIjtzOjU6InN0eWxlIjtzOjA6IiI7czo1OiJjbGFzcyI7czowOiIiO3M6MTA6InNlY3Rpb25faWQiO3M6MDoiIjtzOjEwOiJ2aXNpYmlsaXR5IjtzOjA6IiI7czo0OiJoaWRlIjtzOjA6IiI7fXM6NToid3JhcHMiO2E6MTp7aTowO2E6NDp7czozOiJ1aWQiO3M6OToiNGFjOTI5ZGNjIjtzOjQ6InNpemUiO3M6MzoiMS8yIjtzOjU6Iml0ZW1zIjthOjI6e2k6MDthOjQ6e3M6NDoidHlwZSI7czo2OiJjb2x1bW4iO3M6MzoidWlkIjtzOjk6IjY1ZTFkM2QwZSI7czo0OiJzaXplIjtzOjM6IjEvMSI7czo2OiJmaWVsZHMiO2E6MTM6e3M6NToidGl0bGUiO3M6MDoiIjtzOjc6ImNvbnRlbnQiO3M6MzkxOiI8aDM+QWJvdXQ8YnIgLz4NCk1pY2hhZWwgRXJybG90aDwvaDM+DQpbZGl2aWRlciBoZWlnaHQ9IjE1Il0NCjxwPkxvcmVtIGlwc3VtIGRvbG9yIHNpdCBhbWV0LCAgaW5jaWRpZHVudCB1dCBsYWJvcmUgZXQgZG9sb3JlIG1hZ25hIGFsaXF1YS4gUXVpcyBpcHN1bSBzdXNwZW5kaXNzZSB1bHRyaWNlcyBncmF2aWRhLiBSaXN1cyBjb21tb2RvIHNpcy48L3A+DQoNCjxwPkRvbG9yIHNpdCBhbWV0LCBjb25zZWN0ZXR1ciBhZGlwaXNjaW5nIGVsaXQsIHNlZCBkbyBlaXVzbW9kIHRlbXBvciBpbmNpZGlkdW50IHV0IGxhYm9yZSBldCBkb2xvcmUgbWFnbmEgYWxpcXVhLiBRdWlzIGlwc3VtIHN1c3BlbmRpc3NlIHVsdHJpY2VzIGdyYXZpZGEuIFJpc3VzIGNvbW1vZG5hcyBhY2N1bXNhbi48L3A+IjtzOjU6ImFsaWduIjtzOjY6ImNlbnRlciI7czoxMjoiYWxpZ24tbW9iaWxlIjtzOjA6IiI7czo5OiJjb2x1bW5fYmciO3M6MDoiIjtzOjg6ImJnX2ltYWdlIjtzOjA6IiI7czoxMToiYmdfcG9zaXRpb24iO3M6MjA6Im5vLXJlcGVhdDtsZWZ0IHRvcDs7IjtzOjc6ImJnX3NpemUiO3M6NDoiYXV0byI7czoxMzoibWFyZ2luX2JvdHRvbSI7czowOiIiO3M6NzoicGFkZGluZyI7czowOiIiO3M6NzoiYW5pbWF0ZSI7czowOiIiO3M6NzoiY2xhc3NlcyI7czowOiIiO3M6NToic3R5bGUiO3M6MDoiIjt9fWk6MTthOjQ6e3M6NDoidHlwZSI7czo1OiJpbWFnZSI7czozOiJ1aWQiO3M6OToiOWY5ZmM1YjMzIjtzOjQ6InNpemUiO3M6MzoiMS8xIjtzOjY6ImZpZWxkcyI7YToxODp7czozOiJzcmMiO3M6OTc6Imh0dHBzOi8vdGhlbWVzLm11ZmZpbmdyb3VwLmNvbS9iZS93ZWJpbmFyL3dwLWNvbnRlbnQvdXBsb2Fkcy8yMDE5LzA4L3dlYmluYXItYWJvdXQtc2luZ25hdHVyZS5wbmciO3M6NDoic2l6ZSI7czowOiIiO3M6NToid2lkdGgiO3M6MDoiIjtzOjY6ImhlaWdodCI7czowOiIiO3M6NToiYWxpZ24iO3M6NjoiY2VudGVyIjtzOjc6InN0cmV0Y2giO3M6MToiMCI7czo2OiJib3JkZXIiO3M6MToiMCI7czo2OiJtYXJnaW4iO3M6MDoiIjtzOjEzOiJtYXJnaW5fYm90dG9tIjtzOjA6IiI7czoxMDoibGlua19pbWFnZSI7czowOiIiO3M6NDoibGluayI7czowOiIiO3M6NjoidGFyZ2V0IjtzOjE6IjAiO3M6NToiaG92ZXIiO3M6MDoiIjtzOjM6ImFsdCI7czowOiIiO3M6NzoiY2FwdGlvbiI7czowOiIiO3M6OToiZ3JleXNjYWxlIjtzOjE6IjAiO3M6NzoiYW5pbWF0ZSI7czowOiIiO3M6NzoiY2xhc3NlcyI7czowOiIiO319fXM6NDoiYXR0ciI7YTo5OntzOjg6ImJnX2NvbG9yIjtzOjc6IiM4MWUxZDAiO3M6ODoiYmdfaW1hZ2UiO3M6MDoiIjtzOjExOiJiZ19wb3NpdGlvbiI7czoyMDoibm8tcmVwZWF0O2xlZnQgdG9wOzsiO3M6NzoiYmdfc2l6ZSI7czo0OiJhdXRvIjtzOjc6Im1vdmVfdXAiO3M6MDoiIjtzOjc6InBhZGRpbmciO3M6MTQ6IjYwcHggNDBweCA0MHB4IjtzOjEzOiJjb2x1bW5fbWFyZ2luIjtzOjA6IiI7czoxNDoidmVydGljYWxfYWxpZ24iO3M6MzoidG9wIjtzOjU6ImNsYXNzIjtzOjA6IiI7fX19fX0=
    thanks
  • Yes I managed to do that on my own by inspecting the demo webpage and rebuilding in my own installation. The issue I am having is that this sits against the left hand edge of the browser. It is not pushed over like it is in the demo. I can not find the CSS that you used, whether it is margin or padding to the left. Also I can not see how you achieved the more centralised box using the vanilla settings in betheme ever. Can you tell me how to do that bit?
  • In fact it appears to be a margin on ALL the content, however

     #Content {
        margin: 200px;
    }

    Will not work, I only want this margin on this specific page to recreate the look of bewebinar.
  • Please always attach a link so we can check it out. If the page is offline(localhost) then our help will be limited, you will have to contact us when the page is online. Also please make sure that the page is not under maintenance before you provide us the link.
    It is always a good idea to also attach a screenshot, for that use services like snag.gy or pasteboard.co
    thanks
  • edited January 2020
    I am just asking how you added the margin to the page content in your be webinar about us page. The page is live because it is YOUR page Pablo.
  • I do not see where margin should be applied there because it looks proper on BeWebinar, that's why I asked you about it.

    If you want to add the padding for page content, just edit first section and apply the pixels value in field dedicated to it.

    Thanks

  • I literally just want to add a margin or padding to the left and right of the page. Not the top or bottom, but the left and right of the page. At present there is no margin to my page. The yellow squares in the photo show the section I want to amend.

  • Okay, I do understand now.
    It's called the "Grid Width" and you can change it in the Theme Options > Global > General

    Thanks
  • You are wonderful! Thank you!
  • edited January 2020
    All done with now... I found a way
Sign In or Register to comment.