svg logo not fully displayed in firefox

101
January 25, 2022, at 07:10 AM

so this is my svg logo rendered in chrome:

and this is what is display in firefox:

I can't understand why and how it is rendered like this in firefox.

this is the simple code:

<img src="/img/logo.svg" width="150" height="45" alt="MQSB" />.

Does any body know how I can fix that ?

Edit:

This is the rest of the code... But I don't think it would help.

<Navbar className='px-5 mb-5' collapseOnSelect expand="lg" bg="dark" variant="dark">
        <Navbar.Brand as='span'>
            <Link to='/'>
                <img src="/img/logo.svg" width="150" height="45" alt="MQSB" />
            </Link>
        </Navbar.Brand>
        <Navbar.Toggle aria-controls="responsive-navbar-nav" />
        <Navbar.Collapse className='text-center' id="responsive-navbar-nav">
            <Nav className="me-auto">
                {(user && user.token) &&
                    <Link style={{ color: 'white', textDecoration: 'none' }} className='my-1 mx-3' to='/publish-article'>Publier</Link>
                }
                <Link style={{ color: 'white', textDecoration: 'none' }} className='mx-3 my-1' to='/search-article'>Naviguer</Link>
                <Link style={{ color: 'white', textDecoration: 'none' }} className='mx-3 my-1' to='/quizz'>Quizz</Link>
                <Link style={{ color: 'white', textDecoration: 'none' }} className='mx-3 my-1' to='/about'>À propos</Link>
                <Link style={{ color: 'white', textDecoration: 'none' }} className='mx-3 my-1' to='/contact'>Contact</Link>
            </Nav>
            <Nav>
                {(user && user.token) ? <>
                    <NavDropdown align="end" className='text-primary text-center' title={user.infos.username} id="collasible-nav-dropdown">
                        <Link className='text-center' to='/account/settings' style={{ color: 'black', textDecoration: 'none' }}>
                            <NavDropdown.Item as='span'>
                                Mon compte
                            </NavDropdown.Item>
                        </Link>
                        <NavDropdown.Divider />
                        <NavDropdown.Item className='text-center' onClick={logOut}>Déconnexion</NavDropdown.Item>
                    </NavDropdown>
                </> : <>
                    <NavDropdown className='text-primary' align="end" style={{ color: 'black' }} title="Mon compte" id="collasible-nav-dropdown">
                        <Link to='/login' style={{ color: 'black', textDecoration: 'none' }}>
                            <NavDropdown.Item as='span' className='text-center'>
                                Connexion
                            </NavDropdown.Item>
                        </Link>
                        <Link to='/register' style={{ color: 'black', textDecoration: 'none' }}>
                            <NavDropdown.Item as='span' className='text-center'>
                                Inscription
                            </NavDropdown.Item>
                        </Link>
                    </NavDropdown>
                </>}
            </Nav>
        </Navbar.Collapse>
    </Navbar >
Answer 1

The problem is not in page HTML/CSS or whatever.

There is probably wrong scaling of the inner images.

  1. Open the URL of the image in FireFox https://monquartiersebouge.fr/img/logo.svg
  2. Open the Inspector CTRL+Shift+I
  3. Navigate to svg > defs > image#img2
  4. Set the actual width 1522 to some lower number such as 1100
  5. Now the svg image will be shown in full range without cropping

<image id="img2" width="1100" height="409" preserveAspectRatio="none" xlink:href="data:image/png;...." />

So review the source image and align inner image dimensions.

READ ALSO
Laravel 8 route

Laravel 8 route

I run php artisan route:cache ,I didn't notice that this command can only run in production and cause this error when I want to run php artisan route:list

85
Cannot Run Java Class with Java [duplicate]

Cannot Run Java Class with Java [duplicate]

I want to nip in the bud that I have already been through all of the points in this excellent answer here: and will explain why they didn't work and what my problems areI am working through a book by Robert Nystrom called Crafting Interpreters

70
How to graph the data accumulation of an existing variable in the code in python

How to graph the data accumulation of an existing variable in the code in python

Good afternoon, I'm learning python and I am making some graphics with a file with data, dates and times My first goal was to graphic the data vs time, Magnitude vs Fulltime, only Saturday and Sundays (d2 and w) vs time, and only the 11pm to 12md of Business...

53
pyDatalog program fails on on Android Pydroid3 platform

pyDatalog program fails on on Android Pydroid3 platform

I can't get the Python program at https://githubcom/pcarbonn/pyDatalog/blob/master/pyDatalog/examples/graph

114