July 11, 200818 yr Hello there again, I'm trying my best to further my CSS knowledge, but it really is giving me a sore head!! Getting there though. My latest stumbling block is the min-width property:- I have started a page, and with the width set at 800px, i have a 400px image on the left hand of the page, and a 180px image on right hand side. when i collapse the browser window, i want the images to come together but stopping at 650px. How do i do this? Any help would be appreciated Cheers CSS #logo{ background:url(images/logo.jpg) no-repeat; height:223px; width:400px; float: left; text-align: left; border: solid 1px black } #logo span {display:none;} #logo_right { background:url(images/art-board.jpg) no-repeat; height:223px; width:180px; float: right; border: solid 1px black } HTML body{background-color: black; margin: 0cm auto; text-align: center; } #wrapper { background-color:white; height: 100%; display: table; width: 810px; margin: 0 auto; } </style> </head> <body> <div id="wrapper"> <div id="logo"><span><h1>SITE<br>LOGO<br>HERE</h1></span> </div> <div id="logo_right"> </div> </div>
July 11, 200818 yr you need to look into liquid designs in css here is a start for you http://www.mardiros.net/liquid-css-layouts.html
July 11, 200818 yr add min-width:650px; to your wrapper... Beware though, min-width doesn't work in all browsers
July 11, 200818 yr add min-width:650px; to your wrapper... Beware though, min-width doesn't work in all browsers same as max width. you can also download some java to help it be more comptable with brouwsers minmax.js http://www.doxdesk.com/software/js/minmax.html
July 11, 200818 yr I usually put min-width:650px; for the normal browsers and target IE through conditional comments and just put width:650px;
July 13, 200818 yr You can read this article. It is better to view it with a non-IE browser. http://perishablepress.com/press/2007/01/1...ernet-explorer/
Create an account or sign in to comment