6 replies [Last post]
LeonLatex
LeonLatex's picture
Offline
newbie
Last seen: 3 weeks 5 days ago
Timezone: GMT+1
Joined: 2021-03-11
Posts: 2
Points: 7

Hello, and good morning (it's 04:45 here in Norway). Thank you for the membership.
Here is my first question.
I have a litle problem with a DIV box controlled with CSS. I want the DIV box and the text within it be centered.
The text wirhin it is OK and centered, but the DIV box wont center no matter what i do. Can any of you guys see what's wrong?
This is the CSS for it:

background-color: #ffcc99;
margin: auto;
height: 50px;
width: 50%;
position: fixed;
bottom: 5px;
font-weight: normal;
font-size: 8;
text-align: center;

I would also like to add that I want this DIV box to remain centered at the bottom and remain there, centered.
I can also add to the case that I have two other DIV boxes centered over this one. There is a DIV box for logo, and a
DIV box for news updates. These two behave exemplary exactly as I wish. It only applies to the DIV box I have at the bottom.

I have seen me blind on this problem. Can you help me?

--
Leon

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 4 weeks 1 day ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Hi Leon, thanks for

Hi Leon, thanks for posting.

Can you please post your entire HTML and CSS code please? A snippet of CSS with no context makes it impossible to help diagnose your issue.

Cheers!

Verschwindende wrote:
  • CSS doesn't make pies

LeonLatex
LeonLatex's picture
Offline
newbie
Last seen: 3 weeks 5 days ago
Timezone: GMT+1
Joined: 2021-03-11
Posts: 2
Points: 7

Cheers mate. Of course I can

Cheers mate. Of course I can send you the whole coding and scripting files.

After checking this out a little further i found ot some more.
After studying this a bit more, it seems that there is a fixed and non-movable margin that blocks further placement to the left of the screen. This applies not only to the one box that I mentioned first, but to all three boxes. If the boxes become too wide, they will only move / extend beyond the right margin while they have the same position on the left side a little over a third towards the center of the screen where they lie against a fixed left margin. I want all the boxes equally centered no matter the width they have, and not meet on any margin on either the right or left side. Do you understand, "thepineapplehead"? Study the files I send you and you will understand. I'm completely stuck.

AttachmentSize
HTML_CSS.txt 1.65 KB
Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 22 hours 11 min ago
Timezone: GMT-4
Joined: 2009-10-09
Posts: 2050
Points: 2282

body.base { display:

body.base {
        display: flex;
        justify-content: center;
	background-color: #cc9966;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
 
}

Is that what you were asking?

Also, may I caution you against divitis? Make your markup semantic instead.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 4 weeks 1 day ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Hi, apologies for not

Hi, apologies for not replying sooner. The code you've posted seems to do what you're expecting, what issues are you having? What is it doing, or rather not doing, for you?

Verschwindende wrote:
  • CSS doesn't make pies

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 4 weeks 1 day ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Verschwindende wrote: Also,

Verschwindende wrote:

Also, may I caution you against divitis? Make your markup semantic instead.

That is certainly a blast from the past! 15 years on and now we have even more semantic elements to mark up our HTML with. Shame I don't have rights to update that topic.

Verschwindende wrote:
  • CSS doesn't make pies

Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 22 hours 11 min ago
Timezone: GMT-4
Joined: 2009-10-09
Posts: 2050
Points: 2282

You could always make a Part

You could always make a Part 2. DIVitis still exists. The vaccine is semantic markup.