graphics616 on "[Theme: The Bootstrap] Dynamically change which header image is used based on screen size."

Hi Pascal.

What the above course in Lynda.com and the previous course: "Creating a Responsive Web Design" show how to do is use a header structure similar to this:

<link rel="stylesheet" type="text/css" href="css/screen_styles.css" />
		<link rel="stylesheet" type="text/css" href="css/screen_layout_large.css" />
		<link rel="stylesheet" type="text/css" media="only screen and (min-width: 50px) and (max-width: 500px)" href="css/screen_layout_small.css" />
		<link rel="stylesheet" type="text/css" media="only screen and (min-width: 501px) and (max-width: 800px)" href="css/screen_layout_medium.css" />
        <!--[if lt IE 9]>
            <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->

to call different .css files with differing content based on your browser resolution.

Try to Google how to achieve that if you do not want to use the courses from Lynda.com. I am sure there are several free tutorials out there explaining these media calls. And there is probably a way to do this in a single css file as well but I am not to that point yet.

Hope this helps.