Okay, I did two examples. File names are not conforming to make them easier to identify for this thread. My HTML/CSS skills are extremely rusty as I've not done a web page in about two decades! And, back then, I had Dreamweaver. So this is a challenge for me :)
Yours is "testHTML" and name of 3 preview snapshots used. Next is my actual HTML and CSS "TESTindex" modified to strip out content and name of 3 preview snapshots used. These represent the home page of the site. I have two other HTML/CSS groups; one is the index page for each group of photos done as mockup of a photo contact page (5up; multi row thumbnails and identifying text; click image to call individual full size page). The thumbs are set in table format at this point as I'm trying to get them done for relatives to see. Aim is to convert to <DIV> tags if I find the example website again (thought I bookmarked it). The other is the HTML/CSS "full size" image page. Both of these also display differently in BBEdit to browsers. On Wednesday, April 17, 2024 at 2:06:02 AM UTC-4 Bruce Van Allen wrote: > See how the following complete minimal html doc renders in BBEdit preview > and all browsers you have available. It would be great if you have at least > one more way to view than just Safari and BBEdit preview, to help narrow > the problem. > > This HTML links in no style sheets or style elements. The only styling > here sizes p text in the main element at 16 points and in the footer > element at 12 points. 16 points is the default text size in most browsers. > > (The tags for the head element aren’t necessary any more, but BBEdit’s > checker still dings you if they’re omitted.) > > I hope this shows as plain text in your email :) > > ######## Don’t include this line ######### > <!DOCTYPE html> > <html lang="en"> > <head> > <meta charset="UTF-8"> > <meta name="viewport" content="width=device-width,initial-scale=1"> > <title>Page Title</title> > </head> > <body> > <main style="font-size:16pt;"> > <div> > <h1>This is a heading</h1> > <p>This is a paragraph.</p> > <p>This is another paragraph.</p> > </div> > </main> > <footer style="font-size:12pt;"> > <hr> > <h1>This is a heading in the footer</h1> > <p>This is a paragraph in the footer. > </footer> > </body> > </html> > > ######## Don’t include this line ######### > > How this looks in different renderings may point to the problem. > > — Bruce > > _bruce__van_allen__santa_cruz_ca_ > > > > > > > On Apr 16, 2024, at 10:21 PM, Raizel <[email protected]> wrote: > > > > Both are snippets so missed copying into message, sorry. The CSS and > HTML both validated using W3C validator. The free Bbedit version doesn't > have validation feature which in essence does same thing as W3C. > > > > > > On Wednesday, April 17, 2024 at 1:16:34 AM UTC-4 Bruce Van Allen wrote: > > I think before going to Preview (in BBEdit or Safari) it would be good > to use BBEdit’s syntax checker - Menu: Markup -> Check -> Document Syntax. > > > > Could be copy-paste issues, but in your HTML as shown: > > > > - the div with class=“content” needs a closing div tag, after the > closing p tag (not necessarily right after); > > > > - the img element needs at least a closing double-quote mark on the file > name and a closing angle bracket, if not also alt and other image > attributes. > > > > See what Check Document Syntax tells you. > > > > — Bruce > > > > _bruce__van_allen__santa_cruz_ca_ > > > > > > > > > > > > > On Apr 16, 2024, at 9:58 PM, Raizel <[email protected]> wrote: > > > > > > body { > > > font-family: Verdana, Helvetica, sans-serif; > > > background-color: #333333; > > > color: #FFF; > > > font-size: 12px; > > > text-align: left; > > > /* RBC added (top, right, bottom, left) */ > > > } > > > > > > .content { > > > padding: 16px; > > > } > > > <div class="content"> > > > <p>Note: Please include the person's Reference Number, eg: > <b>(A66)</b>.. and more text.</ p> > > > > > > =========================== > > > .footer { > > > position: fixed; > > > left: 0; > > > bottom: 0; > > > width: 70%; > > > background-color: #333333; > > > color: #f1f1f1; > > > font-family: Georgia, Times, serif; > > > font-style: italic; > > > font-size: smaller; > > > padding: 0 0 0 20px; > > > > > > <div class="footer"> > > > <img src="images/image.jpg<br> > > > Thanks go to the relatives that.</div> > > > > > > The is in a <div> and uses <p> that I believe follows the body > statement as I didn't define <p> separately. > > > On Wednesday, April 17, 2024 at 12:49:09 AM UTC-4 Bruce Van Allen > wrote: > > > I meant the HTML text and relevant style blocks/sheets. > > > > > > — Bruce > > > > > > _bruce__van_allen__santa_cruz_ca_ > > > > > > > > > > > > > > > > > > > On Apr 16, 2024, at 9:34 PM, Raizel <[email protected]> wrote: > > > > > > > > Here's capture from BBEdit and Safari Version 17.4.1. > > > > My CSS for <body> is set: font-size: 12px; > > > > My CSS for .footer is set: font-size: smaller; as 9px or ?em (can't > remember but about = to 9px) didn't work either. > > > > On Tuesday, April 16, 2024 at 10:12:22 PM UTC-4 Bruce Van Allen > wrote: > > > > Can you post a minimal example HTML page or fragment that we can > look at both ways? I don’t recall seeing major text size or other > formatting differences between BBEdit preview and Safari. Quite a few > settings might be impinging (BBEdit, Safari, System) ... > > > > > > > > — Bruce > > > > > > > > _bruce__van_allen__santa_cruz_ca_ > > > > > > > > > > > > > > > > > > > > > > > > > On Apr 16, 2024, at 6:13 PM, R B Cohen <[email protected]> > wrote: > > > > > > > > > > When I view in BBEdit (free version), everything looks great. But > when I switch to Safari, not so. The type looks "10 times" larger and > spacing and alignment is different. My HTML pages use CSS stylesheet for > formatting. > > > > > > > > > > Most notable, font-size set to 9px looks more like 18px in Safari > bother offline and online, but renders fine in BBEdit preview. > > > > > > > > > > I'm using Safari Version 17.4.1 (macOS Sonoma). > > > > > > > > > > -- > > > > > This is the BBEdit Talk public discussion group. If you have a > feature request or believe that the application isn't working correctly, > please email "[email protected]" rather than posting here. Follow > @bbedit on Mastodon: <https://mastodon.social/@bbedit> > > > > > --- > > > > > You received this message because you are subscribed to the Google > Groups "BBEdit Talk" group. > > > > > To unsubscribe from this group and stop receiving emails from it, > send an email to [email protected]. > > > > > To view this discussion on the web visit > https://groups.google.com/d/msgid/bbedit/e7d426b9-16d1-4c69-8944-de82c561c4b6n%40googlegroups.com. > > > > > > > > > > > > > > -- > > > > This is the BBEdit Talk public discussion group. If you have a > feature request or believe that the application isn't working correctly, > please email "[email protected]" rather than posting here. Follow > @bbedit on Mastodon: <https://mastodon.social/@bbedit> > > > > --- > > > > You received this message because you are subscribed to the Google > Groups "BBEdit Talk" group. > > > > To unsubscribe from this group and stop receiving emails from it, > send an email to [email protected]. > > > > To view this discussion on the web visit > https://groups.google.com/d/msgid/bbedit/e95ee939-a0a7-476c-b37b-4227b62c4939n%40googlegroups.com. > > > > > > <Screenshot BBEdit 15.jpg><Screenshot Safari.jpg> > > > > > > > > > -- > > > This is the BBEdit Talk public discussion group. If you have a feature > request or believe that the application isn't working correctly, please > email "[email protected]" rather than posting here. Follow @bbedit on > Mastodon: <https://mastodon.social/@bbedit> > > > --- > > > You received this message because you are subscribed to the Google > Groups "BBEdit Talk" group. > > > To unsubscribe from this group and stop receiving emails from it, send > an email to [email protected]. > > > To view this discussion on the web visit > https://groups.google.com/d/msgid/bbedit/58a63a25-52fd-4822-8952-adcc69b2f87an%40googlegroups.com. > > > > > > > > -- > > This is the BBEdit Talk public discussion group. If you have a feature > request or believe that the application isn't working correctly, please > email "[email protected]" rather than posting here. Follow @bbedit on > Mastodon: <https://mastodon.social/@bbedit> > > --- > > You received this message because you are subscribed to the Google > Groups "BBEdit Talk" group. > > To unsubscribe from this group and stop receiving emails from it, send > an email to [email protected]. > > To view this discussion on the web visit > https://groups.google.com/d/msgid/bbedit/d25fd751-4952-4b36-b4f0-290caf36f30dn%40googlegroups.com > . > > -- This is the BBEdit Talk public discussion group. If you have a feature request or believe that the application isn't working correctly, please email "[email protected]" rather than posting here. Follow @bbedit on Mastodon: <https://mastodon.social/@bbedit> --- You received this message because you are subscribed to the Google Groups "BBEdit Talk" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/bbedit/d4e89d57-74a4-440e-9db5-95b66c30b2adn%40googlegroups.com.
