1 reply [Last post]
collinm
Offline
Regular
Last seen: 12 years 42 weeks ago
Timezone: GMT-5
Joined: 2005-03-01
Posts: 29
Points: 0

hi

i have a link to the left... i would like to bring a text to the right of it

#top {
	float: left;
	width: 990px;
        background-image:url(top_img.gif);
	background-color:#515053;
	margin: 0;
	padding: 0 0 10px 0;
	color: #FFFFFF;
	z-index:1000;
        height: 94px;
}
 
#top h1 {
	float: left;
	padding:0 0 0 10px;
	width: 400px;
	display:block;
}
 
#specialtxt{
	float: left;
	position:relative;
	left:-90px;
        top: 42px;
        font-size:12px;
}

in my web page i have

<div id="top">
    <h1><a href="index.php">www.test.com</a></h1>
 
    <div id="specialtxt">
    best product
    </div>
</div>

that work so so... and i need to put the left value to a negative value... not sure if it's normal...

thanks

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 12 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

I believe the problem is the

I believe the problem is the set width in the h1. Try removing it. The h1 will then shrink wrap and the following floating text will sit closer to it. You should remove the positioning on the special text and said text should really be inside a semantic element (not solely a div or span). Also, the display: block on the h1 is not needed as float overrules it, however you should change it to display: inline; to fix an IE double margin bug on floats.