Redirect code to different css file for mobiles

i need some code that i can use to detect mobiles and then change to a css file for the page so it looks good on mobiles. ive been looking around and i can only find redirect codes to mobile versions on websites and i dont want that, i want to stay on the same page but just use a different css file. Thanks to anyone that can help me.

What you want are CSS Media Queries. They can be incorporated into your main CSS file like so. Feel free to adjust breakpoint values as required.
/* Special Styles for Mobiles. */
@media only screen and (max-width: 480px) {
    body { font-size: 75% }
/* Special Styles for Tablets */
@media only screen and (min-width: 481px) {
     body { font-size: 100%; }
/* Special Styles for Desktops */
@media only screen and (min-width: 1025px) {
     body { font-size: 135%; }
Nancy O.

Similar Messages

How can I specify a different css file for mobile browsers?

I'm experimenting with updating our website to be "mobile friendly". I could use some help.
We use a lot of static HTML landing pages for things like links from email ads, etc. What I'm trying to do is have 1 landing page so the content/html page is always the same, but the page will detect what browser/device you are using and then load a different css file depending on what it is. But, we don't want to have to load the style info from the PC version if you're not on a PC.
What I'm doing now is specifying the media type in the css link, like this..
<link rel="stylesheet" href="style.css" type="text/css">
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="mobile.css" type="text/css">
What's happening is it's loading the main stylesheet first, and then the 2nd one changes some styles if you're on a device with a max width of 480 pixels (like an iPhone). But since it's loading the PC styles first, it's making some things look screwy.
So, is there a way to say "If you're on a PC, load this stylesheet. If you're on an iPhone, load this one instead." .. without javascript? I don't trust javascript too much on mobile devices. I feel like this some simple little thing that I'm missing that will make it all automagically work.
We don't want to have different content depending on the browser, just different stylesheets. Can anyone help?

Hi
Would it be better to do 2 different stylesheets, or just one big one and add a section at the bottom like:
@media only screen and (max-device-width: 480px) { .styles {whatever: styles;} }
2 separate style sheets are recommended. The reason for this is that the Safari mobile browser, (as used in iPhone etc) will download any/all images specified in a style sheet even if they are not used or specified in a media-query rule, this is a know bug with that browser.
I'm also having a new issue where the style "clear: both;" doesn't seem
to be working right. I set up my top horizontal menu using float: left,
and there's a lot of links so on the smaller screen it wraps, which is
fine but now the wrapped links are floating over the page content...
This is one of the reasons that floats should not be used in style sheets for mobile devices, the only exception I know of is for small typographical feature such as 'pull-quotes', (and never use float: right;). It is also recommended to include a menu at the bottom of the page, (or at least a link back to the top).
It works, if I have the iPhone as portrait it looks great, but if I turn
it to landscape, everything is zoomed in. But if I switch back to
portrait, everything is the right size. Is there any kind of way to get
the landscape to have the normal zoom level? I know I can do
"initial-scale=1.0", but that is just for when the page loads, not if
you change it afterwards...
I have heard of only one recommendation to fix this and that is a page refresh on resize, but due to bandwidth limits now being implemented by many providers it is probably not a good idea, you could try setting -
maximum-scale = 1.0
as well.
PZ

Do I need a css file for each fluid layout page I create

DO I need a different css file for each fluid page page I create?
THanks!

The short answer is No!
When you create a second or subsequent document, you need to ensure that the original style sheet has been attached as shown

Separate CSS files for Differenct Applications in the Same Workspace

I am working in APEX 4.0, using Theme 4 (Topaz), primarily with the region template "Top Bar." The application I am working on has gotten so large that I decided to break it into two applications. So I copied the original application and then deleted the pages that I did not want in the second application. I then modified the authentication for a single login. One of the nice things about the Top Bar template is that you can color the background. I had a blue background in the first application and wanted to use a differenct color in the other. So I created a second CSS file and uploaded it to the Cascading Style Sheets area of the Shared Components file for the second application. Turns out that both it and the style sheet for the first application now show up in the CSS file area. The CSS file for the second application has no effect. Here is the CSS code:
.rc-content-main
background-color: #E5E5AA;
}I also tried giving the region on each page in the second application a static id and then identifying them in the CSS file by the id. That didn't work either, at least not yet. Sometimes it takes the server a while to refresh.
Question: For two applications in the same workspace, can there be separate CSS files? If so, how do I set them up so that each responds only to one of the applications?
Edited by: Doug on Nov 14, 2012 4:54 AM
Edited by: Doug on Nov 14, 2012 7:16 AM

Hello,
If you upload your file to Shared Components >> Cascading Style Sheetst then:
edit your page template in the header section and just before +*</head>*+ tag add :
<link rel="stylesheet" src="#WORKSPACE_IMAGES#MY_FILE.css" type="text/css" />And that will be applied for all pages that have the same Page Template.
You can edit a page and put this in the header section to be applied only for a that page:
<style>
<link rel="stylesheet" src="#WORKSPACE_IMAGES#MY_FILE.css" type="text/css" />
<style>If the file is on your web server then replace #WORKSPACE_IMAGES# with #IMAGE_PREFIX#
This should be helpful to you:
http://docs.oracle.com/cd/E23903_01/doc/doc.41/e21674/concept_sub.htm
Best Regards,
Fateh
If you believe that my answer is correct or helpful to you, then please mark it as helpful or correct...

Help on css files for multiple platforms from media queries.

I am trying to make a new site friendly to bith the tablet and smart phone users. My media queries program requires me to attach new css files for each new platform. When I design these new css files do I simply go to the box and limit the width? Is there something else I need to do?

If you're using the Media Queries panel in Dreamweaver, then yes. You just specify the .css file, and enter in the min and/or max width for each range of screen sizes.
It will insert code that looks something like:
<link href="tablet.css" rel="stylesheet" type="text/css" media="only screen and (min-width:481px)">

How to create different log files for each of web applications deployed in OC4J

Hi All,
I am using OC4J(from Oracle) v1.0.2.2 and Windows2000. Now I want to know
1. how to create different log files for each of my deployed web applications ?
2. what are the advantages in running multiple instances of oc4j and in what case we should run
multiple instances of OC4J ?
3. how to run OC4J as Windows2000 Service rather than Windows2000 Application ?
Thanks and Regards,
Kumar.

Hi Avi,
First of all I have given a first reading to log4j and I think there will some more easy way of logging debugging messages than log4j (If you could provide me a detailed explanation of a servlet,jsp,java bean that uses log4j and how to use log4j then it will be very helpful for me). The other easy ways (if I am not using log4j) to my problem i.e creating different log files for each of web applications deployed in oc4j are
I have created multiple instances of OC4J that are configured to run on different ports and so on each instance I have deployed a single web application . And I started the 2 oc4j instances by transferring thier error/log messages to a file. And the other way is ..
I have download from jakarta site a package called servhelper . This servhelper is a thread that is started in a startup servlet and stopped in the destroy method of that startup servlet. So this thread will automatically capture all the system.out.println's and will print those to a file. I believe that this thread program is synchronized. So in this method I need not run multiple instances of OC4J instead each deployed web application on single instance of oc4j uses the same thread program (ofcourse a copy of thread program is put in each of the deployed web applications directories) to log messages on to different log files.
Can you comment on my above 2 approached to logging debugging messages and a compartive explanation to LOG4J and how to use LOG4J using a simple servlet, simple jsp is appreciated ...
Thanks and Regards,
Ravi.

Webservice client : different wsdl file for test/production environment

In an ADF application, I need call a web service in model project
In my company, we have 2 environments : test and production.
This webservice is deploye in test server and production server.
So there are 2 different wsdl file for test/production.
I want to make my ADF Application portable cross the 2 environments.
An environment variable can indicate in which environment the ADF application run.
According to this variable, application choose which wsdl/endpoint to call.
If I use "web service Data control" wizard, how can I achieve this?
If I use "webservice proxy" wizard, how can I achieve this?
Thanks!!!!!!

Hi,
I have a model project with ws proxy client and on this proxy I added an adf ws connection called CustomerExperience
then I can do this.
// a test to try to overrule the adf ws connection from EM
Context ctx = null;
try {
ctx = ADFContext.getCurrent().getConnectionsContext();
WebServiceConnection wsc = (WebServiceConnection) ctx.lookup("CustomerExperience");
CustomerExperience customerExperience = wsc.getJaxWSPort(CustomerExperience.class);
} catch (NamingException e) {
LOGGER.severe("got web service loading fault: "+ e.getMessage());
throw new JboException( messages.getString("NOM-999"),
"NOM-999",
null );
I exported this to an adf jar and added this to a webapp.
On runtime the ws connection is not dectected by the webapp so need to copy this ws conn to the connections of the webapp. This works
but can I change it from wlst instead of EM , is this possible?
I don't see the WS connection in wlst (oracle common) adf_listURLConnection('CE_Portal')
thanks

Not able to find userChrome.css file for customizing the Firefox browser. I just installed 20.0.1 firefox browser. Want to disable/remove navigation bar.Pls Hlp

Not able to find userChrome.css file for customizing the Firefox browser. I just installed 20.0.1 Firefox browser version.
I want to disable/remove navigation bar from the browser window, making the browser to work like kiosk mode.
Please Help,
Thanks,
Vishal.

hello,
here is the complete path ..
''C:\Documents and Settings\XXXXXXX\Application Data\Mozilla\Firefox\Profiles\chrome"
Let me know
Thanks,
Vishal.

How to create different log files for different users in log4j

I want to create different logs for different users, using different appenders for each user so that logs are created in his file only.
Confusion:How to direct them to different files in my logger class

Hi Avi,
First of all I have given a first reading to log4j and I think there will some more easy way of logging debugging messages than log4j (If you could provide me a detailed explanation of a servlet,jsp,java bean that uses log4j and how to use log4j then it will be very helpful for me). The other easy ways (if I am not using log4j) to my problem i.e creating different log files for each of web applications deployed in oc4j are
I have created multiple instances of OC4J that are configured to run on different ports and so on each instance I have deployed a single web application . And I started the 2 oc4j instances by transferring thier error/log messages to a file. And the other way is ..
I have download from jakarta site a package called servhelper . This servhelper is a thread that is started in a startup servlet and stopped in the destroy method of that startup servlet. So this thread will automatically capture all the system.out.println's and will print those to a file. I believe that this thread program is synchronized. So in this method I need not run multiple instances of OC4J instead each deployed web application on single instance of oc4j uses the same thread program (ofcourse a copy of thread program is put in each of the deployed web applications directories) to log messages on to different log files.
Can you comment on my above 2 approached to logging debugging messages and a compartive explanation to LOG4J and how to use LOG4J using a simple servlet, simple jsp is appreciated ...
Thanks and Regards,
Ravi.

So how to specify different answer file for different install images in WDS snap-in?

hello
in WDS snap-in, in properties on server name, on client tab, we can define an answer file for unattended windows installation on WDS clients.
my question is, maybe we have added multiple images in WDS snap-in (win xp image, win 7 , win 2008,...)
now this one answer file applies to all of them ?
so how to specify different answer file for different install images in WDS snap-in?
thanks in advanced

Under the "Client" tab of WDS, you should only use an answer-file with settings relevant for the installation. This would be credentials for the WDS deployment share, international settings used during the setup and possibly also destination drive
details (if you want the installation to take care of partitioning the disk etc). The settings relevant for unattend-files used under "Client" would only be of those in phase 1 (WinPE).
However, if you would like to have specific unattend file for every installation, e.g. Win7, Server 2008, Win 8 etc, you can browse to the image under "Install Images" under the image Groups. There you can select properties for every image and
have a personal unattend-file.
hi Joel
very cool. thanks a lot, that really helped me.
best regards

Java.util.logging - different log files for different loggers

I'm having trouble configuring Java logging to use different log files for different loggers.
In log4j, I would do this by configuring multiple loggers each with a different appender. But how can I do this with Java (java.util.logging) logging?
This is the basic idea of what I'd like to do:
com.mycompany.app1.level = FINEST
com.mycompany.app1.<log file> = logfile1.log
com.mycompany.app2.level = ALL
com.mycompany.app2.<log file> = logfile2.log
Any suggestions?

This kind of thing?
import java.io.IOException;
import java.util.logging.FileHandler;
import java.util.logging.Level;
import java.util.logging.Logger;
import java.util.logging.SimpleFormatter;
public class LogTest {
    private Logger app1;
    private Logger app2;
    public LogTest() {
        // setup loggers
        try {
            // first logger
            app1 = Logger.getLogger("com.mycompany.app1");
            FileHandler filehandler = new FileHandler( "logfile1.log" );
            filehandler.setFormatter(new SimpleFormatter());
            app1.addHandler(filehandler);
            // second logger
            app2 = Logger.getLogger("com.mycompany.app2");
            filehandler = new FileHandler( "logfile2.log" );
            filehandler.setFormatter(new SimpleFormatter());
            app2.addHandler(filehandler);
        } catch(IOException ioex) {
            ioex.printStackTrace();
    private void logStuff() {
        app1.log(Level.SEVERE, "a message for log 1");
        app2.log(Level.SEVERE, "a message for log 2");
        app2.log(Level.WARNING, "another message for log 2");
     * @param args
    public static void main(String[] args) {
        new LogTest().logStuff();
}

Can anyone provide a simple css file for Apex Application

Hi,
Can anyone provide a simple css file for Apex Application please don't mention W3schools link to learn...
Regards,
Pavan

in each item have ..HTML Form Element CSS Classes .e.g style="color:red", you can change whatever you want!
or using CSS at page header level.
check the page: http://apex.oracle.com/pls/otn/f?p=25110:3:0:::::
more css and JS file in Google drive(If my application/js/css breaks your computer, your database, your car's transmission anything it's your fault not mine, I have nothing to do with it and will deny all responsibility.)

Load the External text and css file for more frames

hello..
       I created one Movie file. In that I load the External text and css file in first frame and display the first variable value in one text box.
And then in 2nd frame I use another one text field and display the 2nd variable value like that I want to load the more variable in more textboxes with different frames.
     I loaded for first variable value in first frame. But I don't know how to do next frames like that..
     Help me...

You need to load them in the frames they are in. You can store the loaded data in variables in frame 1, but you will need to extend that layer so that whatever is stored is avaliable in other frames. The code to load the data into the other textfields can then be done in the frames where it is needed.
There are other options, such as not using other frames for content or having all of them in frame 1 and making them invisible until you get to the other frames where they get turned visible.

Is there a limit to the number of selectors you can have in a CSS file for Mozilla Firefox to work?

I am writing the CSS code for my website and the CSS is being interpreted correctly by Chrome but is not even being read by Mozilla Firefox. When I use firebug, I can see that the classes appear in the HTML code but are not interpreted in the CSS.
The code for this page was recently added, which puts it on the bottom part of my CSS file. The CSS file has over 2.000 lines. Is it possible that Mozilla Firefox is limiting the number of lines it reads? If so, should I split the code in two or three CSS files (what is the limit per file)?
Thank you!

I don't think it's an issue of file length, however, as a test you could revert to your previously working file and place all the new CSS in a new file, and see whether that makes any difference.
If you clear the error console and reload the page, do you get any unexpected style warnings? By unexpected, I mean things other than, for example, -webkit-transform is not recognized and is being dropped. Illogical messages can indicate an unnoticed typo.

How to create different log files for different levels

Hi,
Can some one please help me with my problem I have here?
I want to send log data to two diffrent files depending on the logging level such as DEBUG and WARN using the same logger instance.
How can you configure this in log4j.properties.
Please post sample code for log4j.properties to achieve this.
Thanks in advance.
Anurag SIngh

Hi,
I have tried your code. the issue is other log file for error is blank. its not writting log to that file.
following is the code of my log4j.properties
Please read the code first
# Set root logger level to DEBUG and its only appender to A1.
log4j.rootCategory=DEBUG,A1
#Appender and its layout for A1
log4j.appender.A1=org.apache.log4j.FileAppender
log4j.appender.A1.layout=org.apache.log4j.PatternLayout
log4j.appender.A1.layout.ConversionPattern=%-4r [%t] %-5p %c %x - %log4j.appender.A1.Threshold=DEBUG
log4j.appender.A1.File=./LogonApplication_Debug.log
log4j.appender.A1.Append=true
#Appender and its layout for A2
log4j.appender.A2=org.apache.log4j.FileAppender
log4j.appender.A2.layout=org.apache.log4j.PatternLayout
log4j.appender.A2.layout.ConversionPattern=%-4r [%t] %-5p %c %x - %
log4j.appender.A2.Threshold=ERROR
log4j.appender.A2.File=./LogonApplication_Error.log
log4j.appender.A2.Append=true
In my logger class i have written something like this:
public static Logger myLogger = Logger.getLogger (LoggerTest.class.getName());
     public static void main(String args[]){
          myLogger.debug("I have logged a debug message");
          myLogger.error("I have logged an error message");
Issue:
Now the problem is that it is creating two files specified in the configuration but it is logging messages both the messages debug and error in only ./LogonApplication_Debug.log file.
Though it is creating the ./LogonApplication_Error.log file, but it is only blank.
Can you please trace whats missing/wrong.
Thanks a lot.
Shanu

Redirect code to different css file for mobiles

Similar Messages

Maybe you are looking for