Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Client-side Scripting _ Help with responsive text!

Posted by: Agares Jul 6 2020, 07:13 PM

Hello guys!
So, I tried to set up a small page for a roleplay blog, but there is a little problem. The top text, is not responsive instead of the background and also the image of Bigby Wolf and the dropdown overlaps with the other words. I'm being crazy and I really need help now.
I'm using repl.it and that's my website from a general point of view

https://Calendario3--agares.repl.co

I'll also attach the .zip file with all the file you need in case you want to modify all the code.


P.S. Sorry for my bad english


Attached File(s)
Attached File  Calendario3.zip ( 66.26k ) Number of downloads: 156

Posted by: pandy Jul 7 2020, 05:22 AM

The menu seems designed to create an overlay just below About in a wider browser window and when the window is more narrow it instead creates it at the bottom of the window and then it also covers the whole width of the window. If the window is really narrow it shows up at the top of the window, again full with but now its background also covers everything below it on the page.

I guess it's that last situation you want different.

Anyway, it's JavaScript and it's over my head. I move the thread to the Client side scripting forum. Maybe Christian can help you.


Posted by: Agares Jul 7 2020, 05:48 AM

QUOTE(pandy @ Jul 7 2020, 05:22 AM) *

The menu seems designed to create an overlay just below About in a wider browser window and when the window is more narrow it instead creates it at the bottom of the window and then it also covers the whole width of the window. If the window is really narrow it shows up at the top of the window, again full with but now its background also covers everything below it on the page.

I guess it's that last situation you want different.

Anyway, it's JavaScript and it's over my head. I move the thread to the Client side scripting forum. Maybe Christian can help you.


Exactly, and I don't want the words to overlap, I'd rather they all stay on the same line, or at least not create that overlap. By the way, thank you! I appreace it! smile.gif

Posted by: pandy Jul 7 2020, 06:07 AM

I didn't see any overlap (more than when the whole page was covered).

Posted by: Agares Jul 7 2020, 07:11 AM

QUOTE(pandy @ Jul 7 2020, 06:07 AM) *

I didn't see any overlap (more than when the whole page was covered).



http://prntscr.com/tddid7

Posted by: pandy Jul 7 2020, 03:30 PM

QUOTE(Agares @ Jul 7 2020, 02:11 PM) *

QUOTE(pandy @ Jul 7 2020, 06:07 AM) *

I didn't see any overlap (more than when the whole page was covered).



http://prntscr.com/tddid7



What page is that? I don't find any page with a google search box. And all linked pages are on another domain. It's a little confusing.

Posted by: Agares Jul 7 2020, 06:01 PM

QUOTE(pandy @ Jul 7 2020, 03:30 PM) *

QUOTE(Agares @ Jul 7 2020, 02:11 PM) *

QUOTE(pandy @ Jul 7 2020, 06:07 AM) *

I didn't see any overlap (more than when the whole page was covered).



http://prntscr.com/tddid7



What page is that? I don't find any page with a google search box. And all linked pages are on another domain. It's a little confusing.


The page that i showed is this:

https://Calendario3--agares.repl.co

resized a bit for showing the issue

Posted by: pandy Jul 7 2020, 07:40 PM

OK, so the links are on two rows in a narrow window and a drop down from a link in a top row overlaps the link in the bottom row. That's what drop downs do. How do you want it instead?

I think a bigger problem that the you've used opacity: 0 with the dropdown. At least I think that's what causes it. The overlapped link text shows through and make everything unreadable.

Also, you have put the style block at the bottom of the page after </html>. Nothing should be there. The style block should be in HEAD.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)