Добавяне на class и оправяне на линкове

redsystem · 26 Юли 2009

Някой може ли ми оправи линковете на тази картинка така както сам тръгнал да го направя;
ЕДИТ: и ако може срещу всяко нещо да пише примерно: Test , test

+1, който ми помогне.

Код:

<html>
<head>
<title>user list</title>
<style>
.body {
background:url('user_list.png');
width: 441px;
height: 235px;
}

.pure {
float: right;
width: 75px;
}

.pm {
width: 30px;
height: 18px;
float: left;
margin-bottom: 10px;
}

.friend {
width: 30px;
height: 18px;
float: right;
margin-bottom: 10px;
}

</style>
</head>
<body>
<div class="body">
   <b>admin</b>
<div class="pure">
<a href="#pm" alt="Send PM"><div class="pm">d</div></a>  
<a href="#friend" alt="Add to friend"><div class="friend">d</div></a>    
</div>
</div>
</body>
</html>

plamka · 26 Юли 2009

пич дай снимка на теб как ти излиза ?! Така не мога да схвана кое как го искаш ... ако може малко по-подробно да опишеш проблема ..

redsystem · 26 Юли 2009

Искам линковете, който сам се пробвал да ги направя да идат точно върху бутончетата от дясно. Схванали ? А колкото до информацията:

plamka · 26 Юли 2009

Тъй като гледам си сложил ПМ и Френд в един див "pure". Защо направо на тоя див не му сложиш margin ... и не си го настроиш така ?! Вариант е .. пробвай .. ако ен става, кажи. А относно това тест ... отсвен ръчно ся не се сещам как ше стане

redsystem · 27 Юли 2009

Направих го така;

Под Мозила е перфектно, обаче под Опера и IE 5,6,7,8 е под всякаква киритика

Моля някой да ми го оправи!

Код:

<html>
<head>
<title>user list</title>
<style>
.body {
background:url('user_list.png');
width: 441px;
height: 235px;
}

.pure {
float: right;
width: 99px;
}

.pm {
width: 30px;
height: 18px;
float: left;
margin: 10px;
padding-top: 5px;
}

.friend {
width: 29px;
height: 18px;
float: right;
margin: 10px;
padding-top: 5px;
}

.user {
padding-top: 5px;
margin-left: 13px;
}

.name {
color: #a29471;
padding-top: 10px;
margin-left: 50px;
}

.rang {
color: #a29471;
padding-top: 7px;
margin-left: 50px;
}

.pol {
color: #a29471;
padding-top: 5px;
margin-left: 50px;
}

.vyzrast {
color: #a29471;
padding-top: 5px;
margin-left: 68px;
}

.o4i {
color: #a29471;
padding-top: 4px;
margin-left: 50px;
}

.teglo {
color: #a29471;
padding-top: 4px;
margin-left: 55px;
}

.hobi {
color: #a29471;
padding-top: 5px;
margin-left: 53px;
}

.skype {
color: #a29471;
padding-top: 4px;
margin-left: 55px;
}
</style>
</head>
<body>
<div class="body">
	<div class="user">
		<b>admin</b>
	<div class="pure">
		<a href="#pm" alt="Send PM"><div class="pm"></div></a>

		<a href="#friend" alt="Add to friend"><div class="friend"></div></a>
	</div>	</div>

	<div class="name">
		Аз
	</div>

	<div class="rang">
		Администратор
	</div>

	<div class="pol">
		Мъж
	</div>

	<div class="vyzrast">
		29
                                     
София
	</div>

	<div class="o4i">

		Кафяви
                                
Бела
                                
180см
	</div>

	<div class="teglo">
71-80кг
                                   
Да
                         
Да
	</div>

	<div class="hobi">
	</div>

	<div class="skype">
		maniak
	</div>
</div>
</body>
</html>

plamka · 27 Юли 2009

Ае пич хилята си написал ... я дай тая снимка user_list.png .. да го напрая аз пък после ще ти дам кода ..

redsystem · 27 Юли 2009

Е колко пъти да давам снимка

redsystem · 27 Юли 2009

Ъп..

plamka · 27 Юли 2009

ем пич .. от цялата раота .. успях само линковете да напрая кат хората .. съдържанието го разцъках ама не иска да се оправя ... има леки разминавания между opera i firefox ... а ИЕ е много зле ... Ето ти кода до тук .. като имам време пак ще разцъкам инфото .. и ако успея , ще ти пиша

Код:

<html> 
<head> 
<title>user list</title> 
<style> 
.body { 
background:url('user_list.png'); 
width: 441px; 
height: 235px; 
} 

.pure { 
 margin: -22px 0 0 351px;
} 

.pm { 
width: 30px; 
height: 18px; 
float:left; 
padding-top: 5px; 
} 

.friend { 
width: 29px; 
height: 18px; 

padding-left: 6px;
padding-top: 5px; 
} 

.user { 
padding-top: 5px; 
margin-left: 13px; 
} 

.name { 
color: #a29471; 
padding-top: 10px; 
margin-left: 50px; 
} 

.rang { 
color: #a29471; 
padding-top: 7px; 
margin-left: 50px; 
} 

.pol { 
color: #a29471; 
padding-top: 6px; 
margin-left: 50px;
padding-bottom: 0px;
} 

.vyzrast { 
color: #a29471; 
padding-top: 5px; 
margin-left: 68px;
 
} 

.o4i { 
color: #a29471; 
padding-top: 6px; 
margin-left: 50px; 
} 

.teglo { 
color: #a29471; 
padding-top: 4px; 
margin-left: 55px; 
} 

.hobi { 
color: #a29471; 
padding-top: 6px; 
margin-left: 53px; 
} 

.skype { 
color: #a29471; 
padding-top: 4px; 
margin-left: 55px; 
} 
</style> 
</head> 
<body> 
<div class="body"> 
   <div class="user"> 
      <b>admin</b> 
   <div class="pure"> 
      <a href="#pm" alt="Send PM"><div class="pm"></div></a> 

      <a href="#friend" alt="Add to friend"><div class="friend"></div></a> 
   </div>   </div> 

   <div class="name"> 
      Аз 
   </div> 

   <div class="rang"> 
      Администратор 
   </div> 

   <div class="pol"> 
      Мъж 
   </div> 

   <div class="vyzrast"> 
      29 
                                      
София 
   </div> 

   <div class="o4i"> 

      Кафяви 
                                 
Бела 
                              180см

   </div> 

   <div class="teglo"> 
71-80кг 
                                    
Да 
                          
Да 
   </div> 

   <div class="hobi"> 
      Чукане, Ебане, Курви, Жени и пак ебане :D 
   </div> 

   <div class="skype"> 
      maniak 
   </div> 
</div> 
</body> 
</html>

t0m3kk · 27 Юли 2009

Давам го напълно кодирано и перфектно работещо под firefox 3, за internet explorer 6 и по-старите версии е малко дървено, но с много малко работа се оправя, но ще ви оставя да се мъчите

Спокойно ако до 24-48 часа не сте го оправили, ще ви го оправя

index.html

Код:

<html>
<head>
	<title>test</title>
	<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1251">
	<link href="style.css" rel="stylesheet" type="text/css" ></link>
</head>
<body>
	<div id="background">
		<div id="left">
			<div id="name">Жорко</div>
			<div id="rang">Администратор</div>
			<div id="sex">Мъж</div>
			<div id="age">18</div>
			<div id="eyes">Кафеви</div>
			<div id="weight">72 кг</div>
			<div id="hobby">Photoshop</div>
			<div id="skype">None</div>
		</div>
		<div id="right">
			<div id="top">
				<div id="pm"><a href="#" title="Изпрати лично съобщение"><img src="pm.png" border="0"></a></div>
				<div id="friend"><a href="#" title="Добави в приятели"><img src="fr.png" border="0"></a></div>
			</div>
			<div id="other">
				<div id="city">Пловдив</div>
				<div id="hair">Черна</div>
				<div id="drinks">Да</div>
			</div>
			<div id="other2">
				<div id="height">173см</div>
				<div id="smoke">Да</div>
			</div>
		</div>
	</div>
</body>
</html>

style.css

Код:

body {
background: #ffffff;
font-size: 12;
font-weight: bold;
}

#right {
float: left;
margin-left: 100px;
}

#other {
margin-top: 81px;
float: left;
}

#city {
margin-bottom: 9px;
}

#hair {
margin-bottom: 10px;
}

#drinks {
margin-left: 21px;
}

#other2 {
margin-top: 133px;
margin-left: 147px;
}

#height {
margin-left: 13px;
margin-bottom: 9px;
}

#top {
margin-left: 125px;
}

#pm {
float: left;
margin-right: 5px;
}

#friend {
float: left;
}

#background {
background-image: url(user_list.png);
background-repeat: no-repeat;
width: 441px;
height: 235px;
}

#left {
float: left;
margin-top: 33px;
margin-left: 43px;
}

#name {
margin-bottom: 11px;
}

#rang {
margin-bottom: 10px;
margin-left: 3px;
}

#sex {
margin-bottom: 7px;
}

#age {
margin-left: 20px;
margin-bottom: 9px;
}

#eyes {
margin-left: -1px;
margin-bottom: 9px;
}

#weight {
margin-left: 10px;
margin-bottom: 10px;
}

#hobby {
margin-left: 5px;
margin-bottom: 7px;
}

#skype {
margin-left: 12px;
}

Eто го и как изглежда резултата при мен!

http://web-tourist.net/project/t0m3kk/view.png

plamka · 27 Юли 2009

ехее .. изгубила ми се е логиката. ..

то супер лесно било .. ама кой да се сети

П.С. Само че пич .. под Опера е зле ...

redsystem · 27 Юли 2009

plamka каза:
ехее .. изгубила ми се е логиката. .. то супер лесно било .. ама кой да се сети

П.С. Само че пич .. под Опера е зле ...

Е то ще бъде хубаво да не е само под Мозила, ами под всички браузери да е екстра.. t0m3kk се надявам да го доправи кода за да е работещ под всички браузери.

Мерси!

Добавяне на class и оправяне на линкове

redsystem

Registered

plamka

Registered

redsystem

Registered

plamka

Registered

redsystem

Registered

plamka

Registered

redsystem

Registered

redsystem

Registered

plamka

Registered

t0m3kk

Registered

plamka

Registered

redsystem

Registered