html - How to center multiple images -


how center multiple images in div element?

basically, need center 4 images. else seems fine. looked through similar questions , tried out nothing seemed work - 1 of them, however, centered images. problem images spread out across of page, when need there couple pixels of space between images.

html:

<!doctype html> <html>     <head>         <title>assignment5.html</title>         <link rel="stylesheet" type="text/css" href="css.css">     </head>     <body>         <h1>visit these famous places</h1>         <div>             <img src="images/beijing-china.jpg" alt="beijing" title="beijing, china">             <img src="images/grand-canyon.jpg" alt="grand canyon" title="grand canyon, pheonix, usa">             <img src="images/sydney-opera-house.jpg" alt="sydney opera hourse" title="sydney opera house, sydney, australia">             <img src="images/statue-of-liberty.jpg" alt="statue of liberty" title="statue of liberty, new york, usa">         </div>     </body> </html>

css:

h1  {             text-align: center;             text-shadow: grey 2px 2px 10px; }  div {         align-items: center;         display: flex;         flex-direction: row;         justify-content: space-between; }  img     {             height: 100px;             width: 150px;             border: 3px solid black;             border-radius: 20px;             margin: 0px auto;             display: block; }

you should put

div{   ...   text-align: center;   ... }

Comments

Post a Comment

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

i running os ububtu 16.04. ultimate goal able run php script cron job every minute. here php script located @ /var/www/html/tests/test/index.php : <?php $directorypath = $_server['document_root']."/tests/test/data/"; echo "directorypath: $directorypath<br><br>";//check $imagefilepathsarray = glob($directorypath . "*.{png,gif}", glob_brace); echo "<br><br>imagefilepathsarray: "; print_r($imagefilepathsarray);//check ?> when open php script in browser visiting url my-ip-address/tests/test/index.php , get: directorypath: /var/www/html/tests/test/data/ imagefilepathsarray:array( [0] => /var/www/html/tests/test/data/pic.png [1] => /var/www/html/tests/test/data/pic.gif ) before writing cron job in crontab file, need check if can run anywhere using terminal . opened ubuntu terminal @ /home/ location, , executed in terminal: sudo php /var/www/html/tests/test/index.php i got following out...
Read more

php - How can i create a user dashboard -

today have questions you, want create user dashboard site, include (obviously), users data, example -email -username -and others stuff how can information, , print them in html page? if can, how can these information via php sessions? shuld use session? example, if user login, , start new session ( session_start() ), how can data print in dashboard? should use php "project"? in advice, have day , thank time!
Read more

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -

i have jquery mobile page fixed full-screen toolbar, data-tap-toggle enabled. straight under toolbar have positioned banner should slide upwards when toolbar hiding , slide downward when toolbar showing. jquery mobile toggles toolbar applying , removing ui-fixed-hidden class - sadly, can't find in documentation of toolbar widget toggle , hide or show event that. how can detect when toolbar toggled, reposition banner? .banner { position: fixed; background-color: darkseagreen; top: 46px; min-height: 48px; width: 100%; text-align: center; line-height: 48px; } <!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.css"> <script src="https://code.jquery.com/jquery-1....
Read more