Printable Version of Topic

Posted by: tudsy Oct 31 2018, 12:14 PM

Hi

I am trying to get working css on mobile. I am testing on the j1 mini prime (4 inches screen size) Android browser.

The css is in the attached file.  art.txt ( 230bytes ) Number of downloads: 860

Posted by: tudsy Oct 31 2018, 12:18 PM

QUOTE(tudsy @ Nov 1 2018, 02:44 AM)

Hi

I am trying to get working css on mobile. I am testing on the j1 mini prime (4 inches screen size) Android browser.

The css is in the attached file.  art.txt ( 230bytes ) Number of downloads: 860

Posted by: pandy Oct 31 2018, 12:30 PM

And what problem are you seeing?

Anyway, that style sheet shouldn't work in any browser because you have mixed HTML with CSS.

Posted by: tudsy Oct 31 2018, 12:54 PM

QUOTE(pandy @ Nov 1 2018, 03:00 AM)

And what problem are you seeing?

Anyway, that style sheet shouldn't work in any browser because you have mixed HTML with CSS.

CODE

<style type='text/css'>




@media screen and (max-width:500px){

body{
          height:30px;
          width:30%px;
}
}




Hi

Thanks for that.

I am seeing the full web page on the mobile phone. That is, the unscaled page.

Thanks.

@media screen and (min-width:501px){


body{
           height:100px;
           width:100px;
}
}

</style>

The STYLE tags are HTML. They are used with an embedded style block in a HTML page. In a linked style sheet you can only have CSS.

Setting a fixed height for BODY seems strange. And in the rule for max-width:500px you have used double units, 30%px. Anyway, 30px height, that's about the height of this smilie => . I don't think you want the page to be that small.

Posted by: pandy Oct 31 2018, 04:50 PM

QUOTE(tudsy @ Oct 31 2018, 06:54 PM)

Posted by: tudsy Nov 1 2018, 07:39 AM

QUOTE(pandy @ Nov 1 2018, 07:20 AM)

QUOTE(tudsy @ Oct 31 2018, 06:54 PM)

Hi

Thanks for that.

I am seeing the full web page on the mobile phone. That is, the unscaled page.

Thanks.

@media screen and (min-width:501px){


body{
height:100px;
width:100px;
}
}

Hi

Thanks for that.

I want to accomplish a web page (ecovib2dsart.php) to fit on the j1 mini prime phone.

Thanks.

You mean max-width, not min-width, right?

Maybe you could explain what you want to accomplish? From your CSS and what you've said I get the impression you want a tiny bit of your page to show and everything else to be cut off.

Posted by: pandy Nov 1 2018, 11:52 AM

You would. There's a property called overflow that decides what should happen with content there isn't room for. The default value is 'visible', which means he content will overflow the box it's in if it's too small. You can change that to 'overflow: hidden'. But it still won't work with BODY because BODY is special.

If you put a DIV inside BODY and put all content inside it and then apply the CSS to that DIV instead of to BODY it will work as you say you want it too. Only I don't think that's really what you want. What's the use of seeing a tiny part of a webpage?