Home/ Questions/Q 6346055
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T20:56:41+00:00

<!DOCTYPE html> <hmtl> <body> <header><h1>This is header</h1></header> <section id=main> <section id=topBlock> <section id=sectionWithUList>…</section> <section

  • 0
<!DOCTYPE html>
<hmtl>
    <body>
        <header><h1>This is header</h1></header>
            <section id="main">
                <section id="topBlock">
                    <section id="sectionWithUList">...</section>
                    <section id="sectionWithImage">...</section>
                    <section id="anotherSectionWithUList">...</section>
                <section>
                <section id="anotherBlock">
                    ...
                <section>
            </section>
        <footer><h5>This is header</h5></footer>
    <body>
<html>

This is my first time that I am writing HTML5 page. I tought that it will go something like this.
Header, main section and footer. In this main section on top I have section with three sections in it (two lists and one image).
But I have a styling problem. I write css for ‘topBlock’ to be display:table; And three section in it to be table cell because
they need to be displayed in one row. But when I add image sections with lists in it goes too large and lists are verticaly centered.
I try to add fixed height to topBlock section but nothing helps. I need a little help to make this topBLock to have inner three section inline.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try adding a vertical-align to the sections.

    #topBlock { display:table; }    
#topBlock section { vertical-align:top; display:table-cell; }
    • 0