Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Recent content by mdavid

  1. M

    can I use only landscape and portrait modes in media queries for responsive design

    I understand that you think I'm being naive, but if I take 2 formats 1. mobile portrait mode where there's only 1 column and divs are stacked vertically. 2. mobile landscape mode where divs are arranged according to available space horizontally and vertically and this view is just enlarged as...
  2. M

    can I use only landscape and portrait modes in media queries for responsive design

    Hi, If all screens are either landscape or portrait is it enough to query (container or media) the orientation to achieve a responsive design?
  3. M

    mobile first. Why do I need a media query for mobile?

    Thanks Johna, That makes sense to me, I ask because all the examples seem to use media queries for all devices. If it's media first then that should be the default.
  4. M

    mobile first. Why do I need a media query for mobile?

    Hi, Silly question! If I'm designing "mobile first" do I need to wrap Mobile portrait mode in a media query? Shouldn't it just be the default layout without querying viewport size? and tablet, desktop etc. should be wrapped in media queries - this makes more sense to me - am I missing something?
  5. M

    how to position divs according to width without media query

    I found I can replace @media query with @container query. So below css changes grid layout between mobile portrait and landscape. .cq-container /* container for grid */ { container-type: inline-size; } .grid { display: grid; grid-template-columns: 1fr 1.5fr 1fr...
  6. M

    how to position divs according to width without media query

    Thanks Rene, guess @media is simplest. just thought if the browser's aware of viewport size, then it may be simple to use clamp to determine div size, but I'm still learning
  7. M

    how to position divs according to width without media query

    Thanks for this Antero, can you give me an example of using breakpoints without media queries. Thanks
  8. M

    how to position divs according to width without media query

    Hi, I have a 3 column layout widths are: 1. 30% 2. 30% 3. 30%. On screens < 900px I want them to appear: 1. 45% 3. 45% <---2. 90%---> I want to do this without media queries. Any suggestions? I just started to look as css clamp() and was wondering if I could use it to change size of div...
  9. M

    HTML & CSS width = widest edge = landscape = vw, height = narrowest edge = portrait = vh

    Thanks very much for explaining, couldn't get my head around 1vh not being constant.
  10. M

    HTML & CSS width = widest edge = landscape = vw, height = narrowest edge = portrait = vh

    Hi John, thanks for this. Really sorry to appear dumb - but there's something I'm not getting. Say I have a viewport 700px X 300px, then in your example: portrait view - height: 100vh; = 700px (1vh = 7px) landscape view - height:100vh; = 300px (1vh = 3px) Is that correct?
  11. M

    HTML & CSS width = widest edge = landscape = vw, height = narrowest edge = portrait = vh

    So the viewport width changes depending on landscape or portrait view. How does that make vh and vw good units to use for responsive design?
  12. M

    HTML & CSS width = widest edge = landscape = vw, height = narrowest edge = portrait = vh

    Thanks OldMan, What I wanted to know is if the widest viewport width is always always refered to as width, landscape and measured in vw units? The narrower viewport width always as height, portrait, and measured in vh units Thanks
  13. M

    HTML & CSS width = widest edge = landscape = vw, height = narrowest edge = portrait = vh

    Hi, I need clarification. I thought vw and vh units where good for responsive design, but I'm confused how they apply in landscape and portrait views. Am I correct in assuming that VW units always apply to the widest side, and VH units always apply to the narrower side? Thanks
  14. M

    HTML & CSS How to rerun php code depending on button clicked

    Hi OldMan, Thanks for this. Didn't quite understand how this would change what's displayed. I had a brainwave - well I thought it was quite clever - if I load everything (I'm using lazy-loading) and then just toggle between display: none/block depending on which group to display? Is that a...
  15. M

    HTML & CSS How to rerun php code depending on button clicked

    Hi, I'm building a gallery site for paintings - the paintings are divided into groups eg. Oil on canvas, Water Color etc. This is the PHP loop I have for displaying Oil on canvas: if ($entry['medium'] == "Oil on canvas") { $count++; $nxtNum = $count + 1...
See more

About Us

Code Forum is a community platform where coding enthusiasts can connect with other developers, engage in discussions, ask for help, and share their knowledge with a supportive community. It's a perfect place to improve your coding skills and to find a community of like-minded individuals who share your passion for coding.

Site links

Stay Connected

Back
Top Bottom