dealing with screen resolution
Hello friends I am working on some project, and I was going forward with coding the front-end until I found out that my application is aweful on old monitors with low screen resolution, the fonts the divs gets so bigger and things start to break. Horizontal slides, and many more new problems appeared. I didn't thought of this thing when I first started working on CSS.
Is there any helpful tip that I can apply revisiting my CSS?...
mid-sentence header!
How would folks here approach this and what do you think would be the best way to mark this up? "Try our" is not part of the previous section but "Live Chat" is the title of the component/section it lies within, and so appears after.
I've seen some discussions about this online and didn't see much consensus so I think some of this is down to personal preference. I'm inclined to wrap the "title" in a
<strong> tag instead of a H3, display it as a block in the hope that screen readers will read accept it as flowing on from the text before. (I'm yet to test this) and then I can put a "visually hidden" H3 before "Try our"... Though this seems to fly in the face of reducing clutter in the code and such....
Vertical Alignment with Percentages, Logo with Aspect Ratio and Progress Bar Alignment
My problem comes in two parts, which seem to heavily rely on each other. The first is the vertical alignment problem. My page has a logo and a progress bar below it like so:
```html
<section>
<img src="logo.svg" id="logo">
<div id="progress-bar"></div>...
Different desktop and mobile version of an image
Anyone knows why it only display the mobile version of the image?
