/    Sign up×
Community /Pin to ProfileBookmark

A Small Detail about Text

Copy linkTweet thisAlerts:
Oct 08.2022

Hello, everyone. My text uses .date, and is in a different position when using different monitors. This is a very small detail and maybe it will happen later on other monitors. So, I need to fix it. Under this is the CSS, and the address to CodePen. Please, help me.

`.date {
margin-top: 1.0rem;
font-size: 3.6rem;
margin-right:26.0rem;
color:blue;
font-family: Courier, monospace;
}
`

https://codepen.io/JoshEir/pen/XWqxYwp

Thank you,
Jeirm

to post a comment
CSS

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@sibertOct 09.2022 — > @Jeirm#1647736 My text uses .date, and is in a different position when using different monitors.

Had a quick look at it, and you may use "semantic" classes instead of "classes" a bit more.

My recommendation is to shrink the problem. Just work with the <header> tag. Nothing else.

[url=https://postimages.org/][img]https://i.postimg.cc/508J3bnp/fiddle.png[/img][/url]
Copy linkTweet thisAlerts:
@JeirmauthorOct 15.2022 — I did shrink the problem; however, I don't understand what you meant by focusing in on header. The problem was solved and I'm going to look up semantic classes now. I do know, instead of margins, I should be using padding.

Thanks for the help,

Joshua
Copy linkTweet thisAlerts:
@sibertOct 15.2022 — > @Jeirm#1647880 I don't understand what you meant by focusing in on header.

By reducing the page to only "header" you get the header to work. Then you take the "main" part and get this to work. And so on. When all is working, you put all together in an entire page. Look at the problem as bricks. Focus on each brick and then put it together as a complete wall.
×

Success!

Help @Jeirm spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...