Jump to content

JoHubb

Members
  • Content Count

    11
  • Joined

  • Last visited

Community Reputation

0 Neutral

About JoHubb

  • Rank
    Newbie

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. JoHubb

    Change Column width in Document

    Is this statement what you mean by a 'silly guessing game'? I was grateful for your help but clearly it only goes a certain distance.
  2. JoHubb

    Change Column width in Document

    Maybe I am being very slow, but when I use your code, I get 3 columns throughout the document. Perhaps I did not make myself clear. For the first two-thirds of the paper I need 4 columns for rows of photos. I have rows of text spanning the entire width of all four columns between these. For the last one-third I want only 3 columns also for rows of photos but I want these photos to take up almost all the available space i.e. they will be larger than the 4 column photos. Again, there will be text spanning the entire width of all four columns between them. Am grateful for your help and interest.
  3. JoHubb

    Change Column width in Document

    Thanks. I get the general drift but don't understand about nth-last-child I need one row of three columns for photos between perhaps 5 or 6 rows of text. I can do this when i am using four columns for the photos, but I don't know how to make the change to three columns half-way through. I can see that the changes I need are made at the top of the document which is a start. And 'nth-last-child' must refer to either the last column, or is it the last row? Am confused.
  4. JoHubb

    Change Column width in Document

    At present, using this at the top of the document, I have four columns. I would like to change this to three columns towards the end of the document. I have experimented without success. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Using Internal CSS</title> <style type="text/css"> body { font-family: Arial, Verdana, sans-serif;} h3 { text-align: center; color: BlanchedAlmond;} p { line-height: 1.21em; font-size: 1.18em; } * { box-sizing: border-box; } .column { float: left; width: 25%; padding: 5px; } /* Clearfix (clear floats) */ .row::after { content: ""; clear: both; display: table; } </style> I'd be grateful for advice. Thanks!
  5. JoHubb

    Images stacked instead of in a row.

    Perfect. I missed that single </div> between the img child elements. Reduced padding to 5%. Thanks again, dsonesuk!
  6. JoHubb

    Images stacked instead of in a row.

    I have two images of different heights to be placed in a row between lines of text. Zoe C2 is a taller file by about 50% than Congo.jpg. This coding sets the pictures one on top of the other. I'd be grateful for advice. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title of the document</title> <style> * { box-sizing: border-box; } .column { float: left; width: 50%; padding: 20px; } /* Clearfix (clear floats) */ .row::after { content: ""; clear: both; display: table; } </style> </head> <body> <h2>Four Foolish Maidens</h2> <p> These four were absolutely stupid. They forgot to bring oil for their lamps.</p> <div class="row"> <div class="column"> <img src="file:///home/howard/Pictures/Congo.jpg" alt="Congo" style="width:10%"> <div class="column"> <img src="file:///home/howard/Pictures/Zoe%20C2.png" alt="Zoe C2" style="width:100%"> </div> </div> </body> </html>
  7. JoHubb

    Images

    This did the trick! This way of doing things would seem pretty fool-proof, using as it does the exact path to the file. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title of the document</title> </head> <body> <h2>Four Foolish Maidens</h2> <p> These four were absolutely stupid. They forgot to bring oil for their lamps.</p> <img src="file:///home/howard/Pictures/Congo.jpg" alt="Congo" width="826" height="516"> </body> </html> Many thanks!
  8. JoHubb

    Images

    Ok, I will try that. I'm travelling tomorrow and on Sat, so can't do much till Sunday or Monday. I plan to post again then.
  9. JoHubb

    Images

    I tried but still no image in .html file. Screenshots explain what I did. Thanks for your interest.
  10. JoHubb

    Images

    Thanks. But you are jumping ahead of me! I am running a desktop PC with Linux. It is not a server. I do not have a website. I am using the 'Try it Yourself' pages. When I try to open my own picture in a 'Try it Yourself' page, it cannot find it. Maybe I am jumping ahead of myself.
  11. JoHubb

    Images

    It's my first post and I am not far up the HTML learning curve. Thanks for having me on these boards. I run Linux Kubuntu and I don't follow this. How does the program know where to look for the sub-folder? There is no path...?? In any case there is no /images sub-folder in my set up. Do I need to create one somewhere? If so, where?
×