Kom ihåg mig?
Home Menu

Menu


v aligna bilden med texten?

Ämnesverktyg Visningsalternativ
Oläst 2009-02-22, 19:38 #1
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Här är kodstycket. Ni ser felet i bilden. Problemet är att nederkanten hamnar i samma höjd som nederkanten på texten, på så sätt trycker ner texten för att kunna få plats i utrymmet. Hur kan jag göra så att mitten på bilden hamnar i mitten av textsträngen? (pil bilden).

Kod:
<div id="topTag"><a href="#">Products</a> <img src="images/folderarrow.jpg" /> <a href="home.html">Product 2</a> <img src="images/folderarrow.jpg" /> Main Description</div>

#topTag {
padding:0px 0px 0px 9px; 
line-height:25px;
text-align:left;
width:770px;
}
Chidori är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-22, 20:06 #2
KarlRoos KarlRoos är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jul 2007
Inlägg: 1 416
KarlRoos KarlRoos är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jul 2007
Inlägg: 1 416
Kod:
<ul id="topTag">
<li><a href="#">Products</a></li>
<li><a href="#">Product 2</a></li>
<li>Main Description</li>
</ul>
Kod:
#topTag li
{
display: inline;
}

#topTag li a
{
padding: 5px;
display: block;
background: url(images/folderarrow.jpg) center right no-repeat;
}
KarlRoos är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-23, 00:28 #3
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Nepp, inte det. Den bryter raden för varje "block". Testar jag ta bort block så kommer inte bakgrunden dit men allt annat ser okej ut.
Chidori är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-23, 10:29 #4
Cosmas avatar
Cosma Cosma är inte uppkopplad
Flitig postare
 
Reg.datum: Sep 2006
Inlägg: 466
Cosma Cosma är inte uppkopplad
Flitig postare
Cosmas avatar
 
Reg.datum: Sep 2006
Inlägg: 466
Har du nån Float element innan dess. Kanske måste bryta floaten med <div class="clear"></div> eller lägga till float.
Cosma är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-23, 18:04 #5
KarlRoos KarlRoos är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jul 2007
Inlägg: 1 416
KarlRoos KarlRoos är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: Jul 2007
Inlägg: 1 416
http://karlroos.se/blandat/valign/

Hoppas det funkar för dig!
KarlRoos är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-24, 16:28 #6
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Hej och tack, men...

.clear
{clear: both;}

Ser inte att du sätter in detta någonstans?

Ska testa koden nu.
Chidori är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-24, 17:33 #7
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Nä nu får det vara nog, löste det med floats och divs.
Chidori är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-24, 18:02 #8
Cosmas avatar
Cosma Cosma är inte uppkopplad
Flitig postare
 
Reg.datum: Sep 2006
Inlägg: 466
Cosma Cosma är inte uppkopplad
Flitig postare
Cosmas avatar
 
Reg.datum: Sep 2006
Inlägg: 466
Hur löste du det? Var det med float och göra?

Jag tänkte mer att du skulle..

Kod:
<ul id="topTag">
<li><a href="#">Products</a></li>
<li><a href="#">Product 2</a></li>
<li>Main Description</li>
</ul>

<div class="clear"></div>
Cosma är inte uppkopplad   Svara med citatSvara med citat
Oläst 2009-02-24, 20:18 #9
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Chidori Chidori är inte uppkopplad
Medlem
 
Reg.datum: May 2008
Inlägg: 79
Kod:
<div id="topTag">
<div id="folderbar"><a href="#">Category 1</a></div>
<div id="folderbar"><a href="#">Sub Category 2</a></div>
Flexible LED strip
</div>

#topTag {
	padding:0px 0px 0px 9px;
	line-height:25px;
	text-align:left;
	width:770px;
}
#folderbar {
	background-image:url(../images/folderarrow.jpg); 
	line-height:25px; 
	background-position:right; 
	background-repeat:no-repeat; 
	float:left; 
	padding-right:15px; 
	margin-right:5px;
}
Chidori är inte uppkopplad   Svara med citatSvara med citat
Svara


Aktiva användare som för närvarande tittar på det här ämnet: 1 (0 medlemmar och 1 gäster)
 

Regler för att posta
Du får inte posta nya ämnen
Du får inte posta svar
Du får inte posta bifogade filer
Du får inte redigera dina inlägg

BB-kod är
Smilies är
[IMG]-kod är
HTML-kod är av

Forumhopp


Alla tider är GMT +2. Klockan är nu 10:05.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson
 
Copyright © 2017