
-
AuthorPosts
-
October 1, 2015 at 10:45 am #512061
Hi,
when my website starts to be responsive, the margins on the header move to the right and the top banner becomes full width. Would be great if we can keep the margins when responsive (I assume that margin will vary based on the size of the screen, which is ok as long as it’s the same as “A” [blue dot on the screenshot] )let me know!
thanks!!
DeliaOctober 1, 2015 at 12:58 pm #512117Hey Delia!
Do you remember we added these codes
#header_main { max-width: 950px; margin-left: 50px; }
Please wrap them into media queries as following
@media only screen and (min-width: 1024px) { /* PLACE THAT BLOCK OF CODES HERE */ }
Regards,
YigitOctober 1, 2015 at 1:17 pm #512133Hey!
ya I do remember
If I replace it: doesn’t work
if I add it: doesn’t work either:(
October 1, 2015 at 1:18 pm #512136Hey!
Do you mind creating a temporary admin login and posting it here privately?
Best regards,
YigitOctober 1, 2015 at 1:24 pm #512142thanks!
October 1, 2015 at 3:42 pm #512226October 1, 2015 at 4:54 pm #512269Hi Yigit!
Thank you for the adjustments!
header lines are ok
missing one important thing: to have margins for the banner (now is full width)do you tink we can adjust that?
thank you again!Delia
-
This reply was modified 9 years, 9 months ago by
libelum.
October 2, 2015 at 9:10 pm #513034Hey!
try this code:
@media only screen and (max-width: 767px) { div#layer_slider_1 { left: 25px; width: 325px; }}
Cheers!
AndyOctober 5, 2015 at 11:11 am #513605Hi!
Thank you for the code!
it works for mobile devices, sorry I didn’t mention (tablets)
when the menu goes to an icon (when responsive starts) the top banner is still full width
can we keep the margin as well?
thank you!!October 5, 2015 at 11:47 am #513631Hi!
adjust my code and use different media queries which fit your needs. Check out this link and look for “Tablets”: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Cheers!
AndyOctober 5, 2015 at 12:01 pm #513653Hi Andy,
I’ve been trying different media queries and I just realize that what we are doing is adjusting the size of the banner, doing so, we will need a media querie for each phone and tablet, what probably will leave us a gap somewhere.Is it possible to add a code that keeps the responsiveness of the top banner but keeping the margins? (in a responsive way)
thank you! ;)
DeliaOctober 5, 2015 at 12:12 pm #513666Hey!
responsiveness does not mean it will look automatically how you want and instead it means you can control different behaviors for different screen sizes (using media queries for example). So there is no code which will do any magic :) and you need to use media queries for different screen sizes.
Best regards,
AndyOctober 5, 2015 at 12:28 pm #513685Hey!
understood! ;)
I was just looking for the same behaviour the top banner has when is full width but adding margins.
(when you resize the window the image just adapts every pixel you resize)
but you said is not possible unless you have a querie for each size, right?
I’m judt double checking, in case before I asked the wrong thingsorry for my ignorance, is not my field and some times I get lost when trying to explain
thank you Andy
Delia
October 5, 2015 at 1:23 pm #513741Hi!
like I already said, you need to use media queries for this: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Best regards,
AndyOctober 5, 2015 at 1:31 pm #513746thank you
October 5, 2015 at 1:47 pm #513758Hey!
you are welcome. Let us know in a new ticket if you have some more questions or issues related to the theme.
Regards,
Andy -
This reply was modified 9 years, 9 months ago by
-
AuthorPosts
- The topic ‘Wrong margins when responsive’ is closed to new replies.