I can't get my logo to sit in the center of my gray background image. My logo will sit to the right of my gray background image or underneath, but it will not sit in the center of my gray image. I am building this application in React.js.
I can't center my logo image in the middle of my gray background image
80 Views Asked by Don Miller At
1
There are 1 best solutions below
Related Questions in CSS
- CSS Class is not applying to element (border width,color,and style attributes)
- How do I find the fonts that are not loading in a CORS situation ( MoovWeb )?
- Positioning child at bottom of parent with scroll
- Play multiple audio files in a slider
- How to set text over image?
- Website zoomed out on Android default browser
- Writing/Overwriting to specific XML file from ASP.NET code behind
- My navbar is not expanding after collapse
- when a checkbox is checked how to display a different hidden element using javascript
- Gaps Vertically Using Dividers
- CSS: Preventing a property to affect on element until the end of transition
- Polygon Button with pure CSS
- transform-origin doesnt apply in safari
- show/hide multiple div tags at once and change the size of the remaining div tag
- Mask the image/maps/div (circle) using css and jquery
Related Questions in REACTJS
- What is `_dereq_()` inside React?
- React TypeError: React.renderComponent is not a function
- React - saving a component in the ref callback
- React Rails component: manually triggering a re-render
- React, ES6 - getInitialState was defined on a plain JavaScript class
- How to get multiple selected options value in React JS?
- React.render replace container instead of inserting into
- reactjs datagrid use html
- props is not initialized in react component
- How to display xml data using Reactjs
- hooking up the data model in ReactJS - syntax
- ReactJS: How to use an immutable empty array or object
- How to use Sinon.js FakeXMLHttpRequest with superagent?
- React select onChange is not working
- ReactJS - Tutorial Comment System > Threaded commenting
Related Questions in CENTER
- Justified Text with central alignment in android
- How can I centre multiple images that are floated across more than one line?
- display div horizontally and vertically center inside parent div?
- Bootstrap 3 thumbnail: both vertically and horizontally centered image
- How to center div circle using skrollr
- centering div vertically in dynamic sized page (using percent)
- CSS Background horizontal centering
- Html text not centered
- HTML & CSS: Centering the Navbar
- How to pile center divs in 3 float:left divs
- Center caption relative to image regardless of image position, within grid column
- How can I center brand above nav bar using Bootstrap v3 and hide it while on mobile?
- Centering a div inside a div on footer
- Vertically center text when parent height is unspecified
- How to sit 2 iframes side by side in the center?
Related Questions in INLINE-STYLES
- CSS attribute selector for CSS height style
- How to programmatically check CSS styles for particular elements?
- How to inline style child DOM element React?
- React.js inline style best practices
- print a web page with inline css
- jquery match elements with style font-size in px
- jQuery losing styles on $(html_with_inline_styles)
- Inline CSS ::selection doesn't working
- How can I override inline styles on contained elements with CSS?
- How can I implement css hover effect in react inline-styling?
- Using inline style string with ClojureScript, Om, and React.js
- Content Security Policy error with unstyled sitemap.xml in Chrome browser
- what is the right Implementation for inline styles CSP in Angular 14 using nonce approach
- I can't center my logo image in the middle of my gray background image
- How to set gradient color for a SVG element as background image?
Trending Questions
- UIImageView Frame Doesn't Reflect Constraints
- Is it possible to use adb commands to click on a view by finding its ID?
- How to create a new web character symbol recognizable by html/javascript?
- Why isn't my CSS3 animation smooth in Google Chrome (but very smooth on other browsers)?
- Heap Gives Page Fault
- Connect ffmpeg to Visual Studio 2008
- Both Object- and ValueAnimator jumps when Duration is set above API LvL 24
- How to avoid default initialization of objects in std::vector?
- second argument of the command line arguments in a format other than char** argv or char* argv[]
- How to improve efficiency of algorithm which generates next lexicographic permutation?
- Navigating to the another actvity app getting crash in android
- How to read the particular message format in android and store in sqlite database?
- Resetting inventory status after order is cancelled
- Efficiently compute powers of X in SSE/AVX
- Insert into an external database using ajax and php : POST 500 (Internal Server Error)
Popular Questions
- How do I undo the most recent local commits in Git?
- How can I remove a specific item from an array in JavaScript?
- How do I delete a Git branch locally and remotely?
- Find all files containing a specific text (string) on Linux?
- How do I revert a Git repository to a previous commit?
- How do I create an HTML button that acts like a link?
- How do I check out a remote Git branch?
- How do I force "git pull" to overwrite local files?
- How do I list all files of a directory?
- How to check whether a string contains a substring in JavaScript?
- How do I redirect to another webpage?
- How can I iterate over rows in a Pandas DataFrame?
- How do I convert a String to an int in Java?
- Does Python have a string 'contains' substring method?
- How do I check if a string contains a specific word?
The fist thing I've noticed is that you've used
{position:relative;}in the background image, and that makes sense, but you've did the same to the other img which doesn't work, so the position of the second img should be{position: absolute;}then you can adjust the position using top, left, bottom and right , hope that helped.