1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Nothing is center????!!!???

Discussion in 'HTML & Website Design' started by Web_Dev_Chris, Nov 12, 2018.

  1. #1
    Hello can someone tell me what I am doing wrong.

    I cannot get anything to center smack, bang, right there in the middle of the page

    https://jsfiddle.net/byc0a8zh/1/
    SEMrush
     
    Web_Dev_Chris, Nov 12, 2018 IP
    SEMrush
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,670
    Likes Received:
    1,564
    Best Answers:
    226
    Trophy Points:
    515
    #2
    Why are you using a SPAN instead of a heading? Spans are inline level elements why do you want it display:block? Everything is centering its TEXT content as it should, so what are you expecting to center? do you mean the block level containers? Those aren't TEXT, what makes you think text-center would effect them? (unless you're learning from a resource that hasn't been updated since IE5 was the norm). That's auto margin's job.

    Also PX around text is an epic /FAIL/ at web development. Most of the time someone says to use pixels in your CSS they're ignorant twaddles you need to tell to sod off. The WCAG says to use EM, so use 'em!

    Also JSFiddle automatically creates your HTML and BODY tags, so you've got those twice in the output source. One of the reasons I consider JSFiddle to be total shite. Just like how I consider HTML 5's idiotic HEADER tag to be equal trash since we already have perfectly good numbered headings.

    I'd give you a working rewrite, but it's hard to decipher what it is you're even trying to accomplish when you have a complete lack of actual semantics.
     
    deathshadow, Nov 14, 2018 IP
  3. Web_Dev_Chris

    Web_Dev_Chris Active Member

    Messages:
    130
    Likes Received:
    5
    Best Answers:
    1
    Trophy Points:
    68
    #3
    Well to style the text, wouldn't it be appropriate to make it a span if it's not a heading? I'm really just playing around with CSS.

    I have updated to code a little.
    Well, I'm really just fiddling around the .wrapper class on the div is not centering the div element perfectly under the text elements.
    It has auto margin applied?

    https://jsfiddle.net/byc0a8zh/2/

    Regards
    Chris
     
    Web_Dev_Chris, Nov 14, 2018 IP
  4. MT Fresco

    MT Fresco Member

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    31
    #4
    header div:nth-child(1), header div:nth-child(2) {
    float: left;
    }
    You are floating header nested div.
    Remove float left and add margin: 0 auto;
    header div:nth-child(1), header div:nth-child(2) {
    margin: 0 auto;
    }
     
    MT Fresco, Dec 2, 2018 IP