#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2016
    Posts
    10
    Rep Power
    0

    CSS & HTML to display this page properly


    Hi,

    I have an existing web page as shown in image.
    I centre the text using <centre></centre> and minimal CSS.
    The problem is that when the text to the left and right of the centre is
    not of equal length, the nice clean line down through the centre wobbles!
    I've experimented with nested <div></div>'s this evening and my head s now spannered.
    Can anyone help out (purple text should remain centred).
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2016
    Posts
    10
    Rep Power
    0
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2016
    Posts
    10
    Rep Power
    0
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2017
    Location
    Bulgaria
    Posts
    15
    Rep Power
    0
    Check if this helps you: https://jsfiddle.net/zsghvw5f/1/
    Zero CSS, just a table
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2016
    Posts
    10
    Rep Power
    0
    Originally Posted by Nikolay
    Check if this helps you: https://jsfiddle.net/zsghvw5f/1/
    Zero CSS, just a table
    Hi Nikolay
    Thanks for your help. I tried that a long time ago and for reasons, which I can't remember in full discarded tables.
    The main reason was that with the use of tables the page refreshes when a link is clicked.
    It's important it does not do that.
    It has to be done with small CSS and <div></div>'s
    The difficult bit is working out how to nest <div></div>'s so that I can have a few blocks each with the purple header centred and the blue linking text below.
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2017
    Location
    Bulgaria
    Posts
    15
    Rep Power
    0
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2016
    Posts
    10
    Rep Power
    0
    Originally Posted by Nikolay
    Hi Nikolay
    Thank you very much.
    That was perfect
  14. #8
  15. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2016
    Posts
    10
    Rep Power
    0
    Now I see the way you nested the <div></div>'s I think it may be easiear to understand next time. Thanks
  16. #9
  17. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2017
    Location
    Bulgaria
    Posts
    15
    Rep Power
    0
    No problem

IMN logo majestic logo threadwatch logo seochat tools logo