Αναζήτηση στην υποστήριξη

Προσοχή στις απάτες! Δεν θα σας ζητήσουμε ποτέ να καλέσετε ή να στείλετε μήνυμα σε κάποιον αριθμό τηλεφώνου ή να μοιραστείτε προσωπικά δεδομένα. Αναφέρετε τυχόν ύποπτη δραστηριότητα μέσω της επιλογής «Αναφορά κατάχρησης».

Learn More

Problems with displaying all photos

  • 3 απαντήσεις
  • 1 έχει αυτό το πρόβλημα
  • 2 προβολές
  • Τελευταία απάντηση από Paul

more options

Hello I have recently updated the photography section of my website, which you can see at http://www.dominicsimpson.co.uk/photography.html

There are 100 photos on there, yet Firefox is missing the first few. I am baffled as to why this is happening. If you view the page in Google Chrome or Microsoft Edge, you'll see that it displays all of the photos, yet Firefox only displays some of them.

I've checked the HTML and CSS, and they validate correctly.

Any help would be much appreciated.

Kind regards Dominic

Hello I have recently updated the photography section of my website, which you can see at http://www.dominicsimpson.co.uk/photography.html There are 100 photos on there, yet Firefox is missing the first few. I am baffled as to why this is happening. If you view the page in Google Chrome or Microsoft Edge, you'll see that it displays all of the photos, yet Firefox only displays some of them. I've checked the HTML and CSS, and they validate correctly. Any help would be much appreciated. Kind regards Dominic

Επιλεγμένη λύση

Perfect! That all works now. Thank you so much for your help - much appreciated. You've been a really great help!

Dominic

Ανάγνωση απάντησης σε πλαίσιο 👍 0

Όλες οι απαντήσεις (3)

more options

Hi Dominic, this is a float containment problem. When you float an element, other elements can slide up next to it. In this case, that seems to crush the width of those first four rows of photos which makes them invisible.

You could remove the float from this rule in your CSS:

.photographytext
{
	padding:		    	1em 5em 1em 1em;
	max-width:				100%;
	text-align:				justify;
	float:					left;
	flex-wrap: 				wrap;
}


Or if you want to make sure that every row of photos always clear floats from a previous line, you could add a clear to this rule:

.row {
	margin-bottom: 10px;
	clear: both; /* do not float up into previous content */
}


More info on floats and clearing: https://developer.mozilla.org/docs/Learn/CSS/CSS_layout/Floats

more options

Επιλεγμένη λύση

Perfect! That all works now. Thank you so much for your help - much appreciated. You've been a really great help!

Dominic

more options

Hello,

I am glad to hear that your problem has been resolved. If you haven't already, please select the answer that solves the problem. This will help other users with similar problems find the solution.

Thank you for contacting Mozilla Support.