Something Wrong in the Breakpoints!!

[Williams]

Hi Everybody,

I've noticed some issues in my project, and wanna share that with you.. Hopefully somebody could help

Here's the demo project after removing all non relative objects
https://files.fm/f/as6xwe4e

And here're my concerns :
1) In the breakpoint 1920, if you make a preview. you'll see a scroll par, and this can only be fixed if you have removed the picture which's in layer7. WHY!!!
2) In the breakpoint 1280, Layer9 and layer12 are in the same length. however, there's a white line underneath layer12. WHY!!
3) As i know the best practices to leave a keywords for Google or any SEO is leaving your text in Keywords under meta tags. but in my case thta's not right and the result was the first paragraph in the project!! am i doing something wrong!!
4) Is there a way to make a border between items of my menu, in this project i use Themeable menu. and how to activate "push affect"!


Thank you in advance...

[crispy68]

1. I think it has something to do with the scroll bar and you are using relative horizontal sizing and relative horizontal position.
2. You need to adjust your layers and image in the 1280px bp. Layer12 is taller than Layer 9. Make both the same height and position them at the same y coordinate. Make sure the pic is same height as well. This should fix it.
3. Not 100% sure what you are asking but keywords in the metatags is pretty much useless anymore. Google does not look at these anymore. You are best off having a good descriptive title, description and good content on your webpage.
4. You could try adding something like:

Code: Select all

<style>
#ThemeableMenu1 li{border-right:1px solid #000000;}
</style>

You may have to play with it a bit. Not sure about the 'push effect'.

As a note, what you are trying to do in #1 and #2 would be better suited using layout grids or flex grid. You are stretching content in layer12 which is deprecated plus it makes your image look odd when it stretches. I would not recommend doing it this way.

[Williams]

Hi Crispy,

Thank you so much for your reply..

1. I think it has something to do with the scroll bar and you are using relative horizontal sizing and relative horizontal position.

What do you exactly mean i'm using relative horizontal sizing and relative horizontal position.!! As i know this scroll could be only there when an object or more out of the breakpoint. and in my case there're only 3 objects, it looks there's a conflict between the Image24 and the design as this issue will be fixed once you have removed Image24. the question here is that a bug!! i'm having same behavior in all project!!! if not so what i am doing wrong!!

2. You need to adjust your layers and image in the 1280px bp. Layer12 is taller than Layer 9. Make both the same height and position them at the same y coordinate. Make sure the pic is same height as well. This should fix it.

Both are in the same position and same height. I've reviewed it carefully. However, this issue should be fixed if you changed layer12 to "Center"


3. Not 100% sure what you are asking but keywords in the metatags is pretty much useless anymore. Google does not look at these anymore. You are best off having a good descriptive title, description and good content on your webpage

let me clarify more this point, if you search for anything in google. let's say yahoo, first result for me yahoo mail with the url of yahoo and underneath the url
" Take a trip into an upgraded, more organized inbox. Sign in and start exploring all the free, organizational tools for your email. Check out new themes, send GIFs ...
You've visited this page many times. Last visit: 9/27/19"

this what i'm asking about! how to insert like a brief for my project to be seen in any search engine!!


4) this code works fine but that's not what am asking about!! i need a border between menu items. let's say home and about so the border should be between both.


Thanks for the notice crispy, yes i know that but actually i love to build my projects with breakpoints. it gives me more control..

[Williams]

An update regarding #4
I've played around the code which provided by Crispy, I've changed right to bottom and it works fine now.. Thank you crispy again. still need some help regarding " push effect " to close this point out..

Pablo, i do appreciate if you could add this option in the menu direct to be more easier..

[Pablo]

Pablo, i do appreciate if you could add this option in the menu direct to be more easier..

You can post suggestions in the 'Suggestions' section of the forum.
If more users find it useful then I will consider it for future development.

https://www.wysiwygwebbuilder.com/forum ... m.php?f=28

[Williams]

Sure i'll..
Could you take a look on my concerns plsss.
Your help is highly very appreciated.

[crispy68]

1. I think it has something to do with the scrollbar and how the layers based on your setting react at each BP. It doesnt take in consideration the width of the scrollbar. I only see the scrollbar at each of your breakpoints and the gap for me is the same as the scrollbar. I'm sure it some sort calculation thing but I'm not sure the answer other than to set the 'overflow-x' property to 'hidden' in the page properties --> Advanced section. This will remove them.

2. I beg to differ. In your demo, the 2 layers are slightly off in height and positioning. When I fixed these it fixed the issue.

3. What you see in the search engines many times is the information you enter in the 'title' and 'description' fields in the meta tag section in page properties.

4.

Is there a way to make a border between items of my menu, in this project i use Themeable menu. and how to activate "push affect"!

this code works fine but that's not what am asking about!! i need a border between menu items

You were not very explanatory in what you were looking for. 'Border between menu items' doesnt say a whole lot. Did you mean the main menu headings or menu items in a submenu? There are 3 different menu modes and the layout can be horizontal or vertical in the Themeable Menu. In no way did you specify a direction. So I assumed you were dealing with a horizontal menu and wanted dividers between the main menu items. Next time, please give more information or upload a picture of what you want to get a more precise answer!

[Williams]

A big Thank you Crispy, It's almost sorted out
Just a question, what do we mean with " overflow-x and overflow-Y "!!

3. What you see in the search engines many times is the information you enter in the 'title' and 'description' fields in the meta tag section in page properties.

Actually the result says something else!! for me it was the first paragraph in the project. it didn't take what i inserted into description of meta tag. that's why i highlighted the point. maybe i do something wrong!!

Still waiting any help regarding the push affect....

Again thank you Crispy.. you're the man

[crispy68]

Click on Page --> Page Properties --> Advanced --> General

change overflow-x to hidden

[Williams]

Yes mate i already did that. and it works well.
my questions in this regard is what does that mean in the design!!