@gorkemyalcinkayaSubmitted over 3 years ago
Open to any advice.
Mehmet
@memsbdmAll comments
- @memsbdmPosted over 3 years ago
Remove your margin in ypour .flex-container and add : display:flex; justify-content:center; align-items:center; min-height:100vh; in your .container class it's going to center your box without margin !
0 - @rizkygusnaSubmitted over 3 years ago
How to make the monitor image stay in the left of the screen all the time for the larger screen?
@memsbdmPosted over 3 years agoin your .image-section and .feature-wrapper add : width: 50%; remove overflow hidden, change right: 2em; to something like left: -20px; and the monitor will be always at the left :)
1 - @rizwanmustafaSubmitted almost 4 years ago
I fixed the background svg position problem using flexbox and simple code lines. I don't think the solution to this problem can be as simple as this but if you have better code, you are welcome. If you see any mistakes I did or any improvements I can make, I will be happy to see your feedback.
@memsbdmPosted almost 4 years agoYou can use background in css for svg. It would be easier :)
2 - @SirenaAlyceDevSubmitted almost 4 years ago
I could not figure out how to get the background image circles positioning correct. Can anyone help with that? I also noticed that some of my bootstrap classes and stylings aren't showing when deployed via Vercel. Can anyone help with that also?
@memsbdmPosted almost 4 years agoBootstraps is not necessary for a little project like that. Use CSS it's so much easier. But if you already can do it in CSS and want to improve your Bootstrap skill it's different.
0 - @memsbdmSubmitted almost 4 years ago
Second junior integration using flexbox and grid
@memsbdmPosted almost 4 years agocorrected display on git, try https://corrected-clip.vercel.app if you have a display problem on your device please comment !
0 - @sahilkakwani9Submitted almost 4 years ago
I know this site has glicthes and i am not able to solve them as im a beginner.so,please help to remove those if u can.
@memsbdmPosted almost 4 years agoHi,
first use border-radius:50% on your picture to do a circle. You can use border: 2px solid white on it after.
Use overflow:hidden.
Don't forget to include the font in your html file in the header.
It should solve some problems !
1 - @SeyBooSubmitted almost 4 years ago
Hey :)
Any comment is welcome.
If you have any idea for improve it tell me please
@memsbdmPosted almost 4 years agoHello !
You can use box-shadow for your button like in design.
Instead of using margin for your container you can display flex your .main then justify-content : center and align-items: center it would be easier and centered. (if you put height:100vh for your main too).
You can also look at your media queries because when we reduce the window it is not optimized.
Hope it helps :)
1 - @sirriahSubmitted almost 4 years ago
Hello, this is my first upload on Fronted mentor. I look forward to your comments. I have some questions:
-
I try to look at it on htmlpreview.github.io, but it takes ages to display it with css. Why? I think that it is caused of background-position in ".main". It calculates positions of those circles on background and it keep them responsive. Is my assumption right? What is the better solution than calc()?
-
What is the best way to display those circles on the background? First, I tried to add svg tags directly to the html, but at last, I added them into the css file as background-image.
-
What tags should i use for the "London, 80K Followers..." etc.? I looked at some solutions from another users and they mostly used p tag. But it is not the "real" paragraph, it is only one or two words. Could it be simply a div?
Thank you
@memsbdmPosted almost 4 years agoPersonally for the background I put them in html then I used transform : translateX() translateY() it's easier I think ! I am also interested to know which tag use for London ...
0 -
- @memsbdmSubmitted almost 4 years ago
First time trying Grid. I have some questions about it.
- How can we use Grid without fixing an height for the section ?
- How can I place the picture and the name because when I use all displays there is always a problem -> name and "verified graduate" are one over the other but below the picture and I think using position absolute for the picture is not the solution.
- For responsive how can I configure heights of the containers ? If I use 1fr it should work only with an explicit height.. I tried to fix a height like 100% or 200vh but not working (maybe fixed height px?)
@memsbdmPosted almost 4 years agoDesign comparison seems good but look the site there is a lot a problems !
0 - @memsbdmSubmitted almost 4 years ago
My third work using Flexbox, I put all cards in position : absolute and then with a transform : translate I placed them. If there was an easier solution you can comment !
@memsbdmPosted almost 4 years agoI forgot to remove a margin-top that's why cards are a bit down :/
2 - @neshanthSubmitted almost 4 years ago
Would appreciate your feedback.
@memsbdmPosted almost 4 years agoFor the background you can put them in display : absolute then do a transform : translateX() translate(Y) to move them where you want like in the design !
1 - @memsbdmSubmitted almost 4 years ago
My first integration using flexbox !
@memsbdmPosted almost 4 years agoI didn't put alt in images because it was just a design, I will do it for my next works here. Also the design is not exactly the same without Figma ! :)
0
