Help with CSS

GigaGreg

Moderator
Staff member
Hi Guys!

I have another problem now, but with CSS, I'm not a very good developer, my skills are visual and photoshop ones, so that's why I am asking you for a help.

If you look on the website, you will see everything centered apart from the bottom which is partners and the footer.
http://igdesigner.co.uk/radio/index.php

CSS for the bottom section of the site:
Code:
#bottom {
margin-top: 310px;
float:center;
position:absolute;
margin-bottom: 10px;
margin-left: 12%;
}

.partner{
font-family:tahoma; 
font-size:11px; 
font-weight:bold; 
color:#000; 
margin:0 auto;
position:absolute; 
margin-left: 7px;
margin-top:-20px; 
left:10px;
}


#partnerzy {
background: url(img/partnerzy1.png) no-repeat; 
width:952px; 
height:114px; 
margin-top:140px; 
position: absolute; 
margin-left: -2px;
}
.logopartner1 {background: url(img/logopartner.png) no-repeat; width:187px; height:61px; position:absolute; top:20px; left:10px; }
.logopartner2 {background: url(img/logopartner.png) no-repeat; width:187px; height:61px; position:absolute; top:20px; left:190px; }
.logopartner3 {background: url(img/logopartner.png) no-repeat; width:187px; height:61px; position:absolute; top:20px; left:370px; }
.logopartner4 {background: url(img/logopartner.png) no-repeat; width:187px; height:61px; position:absolute; top:20px; left:550px; }
.logopartner5 {background: url(img/logopartner.png) no-repeat; width:187px; height:61px; position:absolute; top:20px; left:730px; }

#footer {
background: url(img/stopka.png) no-repeat; 
width:951px; 
height:57px; 
position:relative; 
margin-left: 0;
margin-top:235px;
margin-bottom: 0;
}
.copy {font-family:MyriadPro-Cond; text-tranform:uppercase; font-size:15px;font-weight:bold; color:#750075; position:absolute; top:47px; left:5px; }
.administracja {font-family:MyriadPro-Cond; text-tranform:uppercase; font-size:15px; color:#ffd200; position:absolute; top:15px; left:15px; }
.dogory {background: url(img/dogory.png) no-repeat; width:76px; height:33px; position:absolute; top:0px; right:15px; }
.autorzy {text-decoration:none; font-family:tahoma; font-size:11px; font-weight:bold; color:#811f81; position:absolute; top:50px; right:15px; bottom:1px; }

Html:
Code:
<div id="bottom">
	<div id="partnerzy">
	<span class="partner">partnerzy</span>
		<a href="#" class="logopartner1"></a>
		<a href="#" class="logopartner2"></a>
		<a href="#" class="logopartner3"></a>
		<a href="#" class="logopartner4"></a>
		<a href="#" class="logopartner5"></a>
	</div>
<div id="footer">
	<span class="copy">COPYRIGHT <span style="color:#ffd200;">2013</span> BY  <a href="http://soundstrefa.pl">SOUNDSTREFA</a></span></span>
	<span class="administracja">ZABRONIONE JEST KOPIOWANIE JAKIEJKOLWIEK TRESCI/OBRAZK?W/KODU Z TEJ STRONY.  GRAFIKA JAK I KOD JEST WLASNOSCIA <a href="http://soundstrefa.pl">SOUNDSTREFA.PL<a></span>
	<a href="#belka" class="dogory"></a>
	<span class="autorzy">projekt i wykonanie strony: <a href="http://igdesigner.tk">iGdesigner</a></span>

	</div>
</div>
 

GigaGreg

Moderator
Staff member
Idk why, but this validator picks up silly errors and for me there are not many of them.

That clear both div did not helped at all :D
 

GigaGreg

Moderator
Staff member
un4saken said:
Try to change


Code:
margin-left: 12%;


to


Code:
margin-left: -10%;

Un4saken, you are God seriously.

I couldn't make it, because on my 13" macbook it was ok, when my brother opened website on his wide screen, then it was broken. You have made it work perfectly.

But graphics are cut very bad, so it doesn't looks right, but its not broken anymore on bigger screens!
 

un4saken

Administrator
igdesigner said:
Un4saken, you are God seriously.

I couldn't make it, because on my 13" macbook it was ok, when my brother opened website on his wide screen, then it was broken. You have made it work perfectly.

But graphics are cut very bad, so it doesn't looks right, but its not broken anymore on bigger screens!

No problem mate :friends:

Feel free to ask for help anytime. FYI @Sitebee is much better in css & html than me
 

GigaGreg

Moderator
Staff member
un4saken said:
Feel free to ask for help anytime. FYI @Sitebee is much better in css & html than me

He have some beers in him at the moment, so his help was pointless :D

Try this just before the footer code(html page):

Code:
<div style="clear: both;">&nbsp;</div>

Failing that you`ve got a stray </div> in the page, I`d double check for you but i`ve got beer in me at this moment in time.

Alcohol does not allow you to work properly.
 

giltee0357

New member
Hey DJB you answered one of my questions about the footer code that was missed out on a copy and paste to new page. I could not for the life of me figure out where the issue was. this post made me think if I had that copied over right. Sure enough the code <div style="clear: both;">&nbsp;</div> save this problem.