-
AuthorPosts
-
July 26, 2018 at 2:28 am #990007
I know grid rows are full width – I would like for the image on the right side to remain full width, but I’d like to set a boundary on the right for all items to line up with the logo and the rest of the site content no matter how wide the screen is.
https://www.dropbox.com/s/hd3gzl0si55ysd0/Screenshot%202018-07-25%2017.24.11.png?dl=0
Is there a way to do this?
Thank you!
July 26, 2018 at 1:45 pm #990245Hey Dave,
You might want to try using 1/1 element and put everything in it, it has the container div that will limit the width at the same value as the container in the header.
If you need further assistance please let us know.
Best regards,
VictoriaJuly 26, 2018 at 3:50 pm #990292Good morning Victoria! Thank you for taking the time to reply to my thread. I appreciate it!
I added the 1/1 element but it didn’t perform the expected outcome:
https://www.dropbox.com/s/js3gejgy2sx1ira/Screenshot%202018-07-26%2006.49.24.png?dl=0Here is what I did:
https://www.dropbox.com/s/yk0f5l024q2lntc/Screenshot%202018-07-26%2006.50.14.png?dl=0Did I do something incorrectly? Thanks!
July 27, 2018 at 1:50 pm #990702Hi shreinmedia,
Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?
I meant instead of the grid row use 1/1 and then put you 1/2 with the content inside.
Best regards,
VictoriaAugust 16, 2018 at 6:10 am #997779Sorry for the delay… added a ton of clients in a short period of time.
Added the credentials below. It is the home page.
August 19, 2018 at 4:42 pm #998955Hi,
Please check the link you provided it is not working for me.
Did you have a look at the Grid Row documentation? I hope this will help you add a custom width. If this is not what you are looking for please post a working link so we can take a look at the issue.
Best regards,
VinayAugust 19, 2018 at 6:12 pm #999009Sorry about that… updated link in private
August 19, 2018 at 6:26 pm #999013both elements ( color-section and grid-row) are full-width elements.
I miss this too – an element that can be a container for other elements and can have the sidebar besides.
That would be a great thing.
Espacially the grid-row will be nice to have this behavior – because as you can see at his consturct – ( Link ) – that it would be a very fleible way to layout things.August 19, 2018 at 7:22 pm #999036The main thing I am trying to accomplish is utilizing the grid row to have a full-width element on the right side (photo) while having the left side text conform to the non-fullwidth site dimensions.
August 19, 2018 at 8:42 pm #999075can you sketch what you want to do?
something like this: https://webers-testseite.de/grid-row-2/August 20, 2018 at 7:07 pm #999563At the image below, you can see what I’m thinking… so the image on the right fills up the entire grid row 1/2 column on the right.
On the left 1/2 grid row, the text does not go further than the main site boundaries as indicated by the dotted orange line.
Does that make more sense?
https://www.dropbox.com/s/j9pp2wk0p2hulpr/IMG_1258.jpeg?dl=0
August 21, 2018 at 6:43 am #999669Hi,
Thanks for the screenshot, though it seems to result in a 404 error on dropbox. Could you try uploading it again please?
Best regards,
RikardAugust 21, 2018 at 7:23 am #999679Sorry about that.
https://www.dropbox.com/s/bnoefervvblff6b/IMG_1258.jpeg?dl=0
August 21, 2018 at 11:56 am #999776ok – that is better to understand.
first you had to know your general setting : default width is 1310px ( so half of it is 655px)
if you got a container that is 50% of the total width – how many padding left you will need?
the normal container class has a padding : 0 50px – so from inner Cell we had to diminish it.give those grid-rows a custom class f.e.: special-grid-row
.special-grid-row .flex_cell.avia-builder-el-first { padding-left: calc(50% - 655px) !important; } .special-grid-row .flex_cell.avia-builder-el-first .flex_cell_inner { padding-left: 50px !important; }
see here my construct – i got 1510px on total so my code is with 755px less
https://webers-testseite.de/shreinmedia/- This reply was modified 6 years, 3 months ago by Guenni007.
August 22, 2018 at 1:37 am #1000098Howdy Guenni007 – you are the master! Thank you, again, for being so generous with your time and helping me out here. Means a great deal to me. I already know that I don’t have anything in the café realm that would accurately convey my appreciation – so I’ll just say, BIG THANKS from a dude in Arizona who really needed the help. You made a huge difference.
August 22, 2018 at 8:44 am #1000168Really friendly – thank you for the answer; unfortunately it is not usual here that a positive approach to a solution is answered quickly.
Your welcome!PS : this was the solution for the first (left grid cell – .flex_cell.avia-builder-el-first ) –
you could transfer this solution to the right one yourself ? ( .flex_cell.avia-builder-el-last )
but then it will be better to have a unique class for those grid-row element
maybe ( special-grid-row-left and special-grid-row-right) etc. –- This reply was modified 6 years, 3 months ago by Guenni007.
August 22, 2018 at 8:50 am #1000171Hi,
Thanks for helping out @guenni007 :-)
Please let us know if you should need any further help on the topic or if we can close it @shreinmedia.
Best regards,
RikardAugust 22, 2018 at 1:22 pm #1000298And once again – for your background-image in the right cell !
on mobile this is nearly gone. if you like to show something ( the image ) you can setup a min-height – or do a whitespace hr in it with a given heightAugust 22, 2018 at 5:37 pm #1000442August 22, 2018 at 10:23 pm #1000534All is good, Rikard. This is great. I think this solution needs to be added into the Enfold Theme Documentation as a way of gaining more control over the left or right side of a grid row.
Thank you Guenni007!
August 23, 2018 at 10:10 am #1000649Hi,
Thanks for the feedback, I’ll go ahead and close this thread for now then. Please open a new thread if you should have any further questions or problems.
Thanks again to @guenni007 for all the help.
Best regards,
Rikard -
AuthorPosts
- The topic ‘Align Grid Row Left Side to Site Box’ is closed to new replies.