problema div in ridimensionamento finestra

[brodik]

Buonasera a tutti, ho un problema sul layout di un sito in costruzione...

in pratica nell'header della pagina c'è il logo a sinistra e un testo sulla destra...
nel momento in cui io riduco la dimensione della finestra, il testo si sposta verso sinistra e il logo 'sale sopra' la scritta..

ecco un esempio...
l'immagine del logo è la prima immagine 200x70px trovata su google.. non fateci caso....



Io vorrei che invece il logo rimanesse in quella posizione e il testo, che quindi rimane sulla destra, venisse semplicemente 'tagliato' senza andare a capo...

questo è il css dell'header:

* {
	padding: 0em;
	margin: 0em;
}

body {
	background: #000000 url('images/sfondo.jpg');
	padding: 35px 0px 35px 0px;
}

#header { // il div nero
	position: relative;
	width: 100%;
	height: 9.0em;
	background: #2B2B2B url('images/topbg.gif') repeat-x;
	margin-bottom: 2px;
}

#headercontent { // contenuto in header e contiene i div logo (header) + scritta (text_hd)
	position: absolute;
	bottom: 0em;
	padding: 0em 2.0em 1.3em 2.0em;
}

#header {
	float: left;
}

#header img {
	border: 0px;
}

#text_hd {
	font-size: 20px;
	float: left;
	padding-left: 15px;
}

			<div id="header">
				<div id="headercontent">
					<div id="logo_header">
						<h1>[img]/studio/templates/default/images/logo.png[/img]</h1>
					</div>
					<div id="text_header">
						<h2>Mia azienda
long cat is loooooooooooong
telefono</h2>

					</div>
				</div>
			</div>

quanlche aiutino?

[brodik]

non posso più modificare il messaggio, quindi....

ho visto che un modo per risolvere è impostare la largezza del div principale....
attualmente è impostato su 85%.... se lo imposto in pixel i div dell'header non slittano...
è possibile impostare il div principale sempre a 85% e fare in modo che non possa essere meno di, per esempio, 600px? ovvimenete che sia compatibile con la maggior parte dei browser...

grazie per le risposte...

[Mich_]

Una cosa di questo tipo?

width: 85%;
min-width: 600px;
overflow: auto;      /* o setta il valore che preferisci */

E` perfettamente valido sintatticamente; per quanto riguarda la resa, devi fare prove con varie dimensioni della finestra: probabilmente con finestre minori di 700px (ad esempio sui cellulari) potresti avere qualche problema; e con finestre inferiori a 600px i problemi potrebbero essere gravi.
Ma lascio a te l'onere delle prove.

[brodik]

esatto alla fine avevo messo anche io il min-width anche se non mi sembra sia supportato da IE7..
dell'overflow non ne ho bisogno perchè settandolo su 600px non mi sfora... dici sia meglio indicarlo comunque..?

[Mich_]

IE si comporta in modo retrocompatibile (quirks) se usi una DTD transitional. Si comporta in modo standard con le DTD Strict.

Per IE in modo quirks ci sono gli hack, ma e` sicuramente preferibile farlo lavorare in modo standard.