The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Position | Countdown clock, Countdown clock blocking my h1
newby_coder
post Jan 18 2021, 04:00 AM
Post #1





Group: Members
Posts: 3
Joined: 18-January 21
Member No.: 27,733



Good day,

My countdown clock is "blocking" my h1 text.

very new at coding; will appreciate any help and advise.

regards,



Attached File(s)
Attached File  index.html ( 2.09k ) Number of downloads: 190
Attached File  style.css ( 3.33k ) Number of downloads: 190
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jan 18 2021, 01:21 PM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



That's because you've positioned #countdown absolute relative the browser window. Remove that. #countdown need to be positioned somehow though so it creates a positioning context for the things you have positioned within it.

So remove absolute and the offset (commented out below) and add position: relative.
CODE

#countdown{
   ...
  /*  position: absolute; */
  /*     top: 0; bottom: 0; left: 0; right: 0; */
  position: relative;
}


Interesting with all four offset values set to 0. Is this a mistake or a neat trick I didn't know about? I would have said it's crazy, but it actually seems to center the box. Must play a little with that.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jan 18 2021, 01:27 PM
Post #3


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



QUOTE(pandy @ Jan 18 2021, 07:21 PM) *

Interesting with all four offset values set to 0. Is this a mistake or a neat trick I didn't know about? I would have said it's crazy, but it actually seems to center the box. Must play a little with that.


No, that doesn't work. Must have been something else then. Too bad. sad.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
newby_coder
post Jan 19 2021, 07:48 AM
Post #4





Group: Members
Posts: 3
Joined: 18-January 21
Member No.: 27,733



Thank you very much.

"Interesting with all four offset values set to 0. Is this a mistake or a neat trick I didn't know about? I would have said it's crazy, but it actually seems to center the box. Must play a little with that."

I copied this from the web. I do not know enough to answer your question
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
newby_coder
post Jan 19 2021, 08:01 AM
Post #5





Group: Members
Posts: 3
Joined: 18-January 21
Member No.: 27,733



My positioning still seem to be off (please help)


Attached File(s)
Attached File  index.txt ( 2.1k ) Number of downloads: 169
Attached File  style.txt ( 3.33k ) Number of downloads: 168
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jan 19 2021, 10:16 AM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Got the text labels in place but where are those gradients supposed to be? Are they placed correctly in the example in your first post?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 04:55 AM