What is the code for getting images in one line
5 posters
Page 1 of 1
What is the code for getting images in one line
What is the code for getting images next to each other - in one line - rather than on top of each other? And vice versa?
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
Hi rhe,
what exactly are you looking for? Just don't leave spaces they will appear in a line then.
what exactly are you looking for? Just don't leave spaces they will appear in a line then.
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Re: What is the code for getting images in one line
If it was that easy I wouldn t be asking for help.
It doesn't matter if there is a space or not between them, they still appear the same.
It doesn't matter if there is a space or not between them, they still appear the same.
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
CAn you give an example pic so we can see what your talking about?
Re: What is the code for getting images in one line
You can do it with a table...rhe wrote:What is the code for getting images next to each other - in one line - rather than on top of each other? And vice versa?
Use [/tr][tr] to move down & start a new row
- Code:
[table][tr]
[td][img]http://2img.net/i/fa/shop/en/ban-fm-1.png[/img][/td]
[td][img]http://2img.net/i/fa/shop/en/ban-fm-2.png[/img][/td]
[td][img]http://2img.net/i/fa/shop/en/ban-fm-3.png[/img][/td]
[/tr][tr]
[td][img]http://2img.net/i/fa/shop/en/ban-fm-4.png[/img][/td]
[td][img]http://2img.net/i/fa/shop/en/ban-fm-5.png[/img][/td]
[td][img]http://2img.net/i/fa/shop/en/ban-fm-6.png[/img][/td]
[/tr][/table]
Html
- Code:
<table><tr>
<td><img src="http://2img.net/i/fa/shop/en/ban-fm-1.png"></td>
<td><img src="http://2img.net/i/fa/shop/en/ban-fm-2.png"></td>
<td><img src="http://2img.net/i/fa/shop/en/ban-fm-3.png"></td>
</tr><tr>
<td><img src="http://2img.net/i/fa/shop/en/ban-fm-4.png"></td>
<td><img src="http://2img.net/i/fa/shop/en/ban-fm-5.png"></td>
<td><img src="http://2img.net/i/fa/shop/en/ban-fm-6.png"></td>
</tr></table>
Last edited by RoNo on September 21st 2010, 10:16 pm; edited 1 time in total (Reason for editing : added Html code)
Re: What is the code for getting images in one line
Or since images display as inline elements, just put them together on the same line:
- Code:
[img]http://2img.net/i/fa/shop/en/ban-fm-1.png[/img][img]http://2img.net/i/fa/shop/en/ban-fm-2.png[/img][img]http://2img.net/i/fa/shop/en/ban-fm-3.png[/img]
[img]http://2img.net/i/fa/shop/en/ban-fm-4.png[/img][img]http://2img.net/i/fa/shop/en/ban-fm-5.png[/img][img]http://2img.net/i/fa/shop/en/ban-fm-6.png[/img]
Guest- Guest
Re: What is the code for getting images in one line
Hm, doesn't seem to work.
Okay I've got this contractible menu script.
It looks like this:
And I want to get the buttons in one line. The dark brown ones.
The table code doesn't seem to make a difference.
Okay I've got this contractible menu script.
It looks like this:
And I want to get the buttons in one line. The dark brown ones.
The table code doesn't seem to make a difference.
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
Where are you putting these at?
MrMario- Helper
- Posts : 22186
Reputation : 1839
Language : test
Re: What is the code for getting images in one line
I have the menu in a widget at the minute, cause the images appear on top of each other.
But I want them side by side so I can place them in display - homepage generalities - homepage message cause it's handier when the menu is on top of the page.
But I want them side by side so I can place them in display - homepage generalities - homepage message cause it's handier when the menu is on top of the page.
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
HTML:
BBCODE:
- Code:
<img src="URL"> <img src="URL"> <img src="URL">
BBCODE:
- Code:
[img]URL[/img] [img]URL[/img] [img]URL[/img]
Guest- Guest
Re: What is the code for getting images in one line
Gangstar15 wrote:HTML:
- Code:
<img src="URL"> <img src="URL"> <img src="URL">
BBCODE:Result:
- Code:
[img]URL[/img] [img]URL[/img] [img]URL[/img]
Nope, this doesn't work. I've got a loooong code full of these image codes and all the images stay on top of each other.
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
Can we see the code you use?
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Re: What is the code for getting images in one line
Looks like the widget is to small to make images go next to each other. Make the widget area bigger
MrMario- Helper
- Posts : 22186
Reputation : 1839
Language : test
Re: What is the code for getting images in one line
Sanket wrote:Can we see the code you use?
- Code:
<a href="URL"><img src="URL" alt="HOME"></a>
<script type="text/javascript">
var enablepersist="on" //Enable saving state of content structure using session cookies? (on/off)
var collapseprevious="no" //Collapse previously open content when opening present? (yes/no)
if (document.getElementById){
document.write('<style type="text/css">')
document.write('.switchcontent{display:none;}')
document.write('</style>')
}
function getElementbyClass(classname){
ccollect=new Array()
var inc=0
var alltags=document.all? document.all : document.getElementsByTagName("*")
for (i=0; i<alltags.length; i++){
if (alltags[i].className==classname)
ccollect[inc++]=alltags[i]
}
}
function contractcontent(omit){
var inc=0
while (ccollect[inc]){
if (ccollect[inc].id!=omit)
ccollect[inc].style.display="none"
inc++
}
}
function expandcontent(cid){
if (typeof ccollect!="undefined"){
if (collapseprevious=="yes")
contractcontent(cid)
document.getElementById(cid).style.display=(document.getElementById(cid).style.display!="block")? "block" : "none"
}
}
function revivecontent(){
contractcontent("omitnothing")
selectedItem=getselectedItem()
selectedComponents=selectedItem.split("|")
for (i=0; i<selectedComponents.length-1; i++)
document.getElementById(selectedComponents[i]).style.display="block"
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document·cookie.length > 0) {
offset = document·cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document·cookie.indexOf(";", offset);
if (end == -1) end = document·cookie.length;
returnvalue=unescape(document·cookie.substring(offset, end))
}
}
return returnvalue;
}
function getselectedItem(){
if (get_cookie(window.location.pathname) != ""){
selectedItem=get_cookie(window.location.pathname)
return selectedItem
}
else
return ""
}
function saveswitchstate(){
var inc=0, selectedItem=""
while (ccollect[inc]){
if (ccollect[inc].style.display=="block")
selectedItem+=ccollect[inc].id+"|"
inc++
}
document·cookie=window.location.pathname+"="+selectedItem
}
function do_onload(){
uniqueidn=window.location.pathname+"firsttimeload"
getElementbyClass("switchcontent")
if (enablepersist=="on" && typeof ccollect!="undefined"){
document·cookie=(get_cookie(uniqueidn)=="")? uniqueidn+"=1" : uniqueidn+"=0"
firsttimeload=(get_cookie(uniqueidn)==1)? 1 : 0 //check if this is 1st page load
if (!firsttimeload)
revivecontent()
}
}
if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload
if (enablepersist=="on" && document.getElementById)
window.onunload=saveswitchstate
</script><h3 onClick="expandcontent('sc1')" style="cursor:hand; cursor:pointer"><img src="URL" alt="MESSAGES"></p></h3><div id="sc1" class="switchcontent">
<a href="URL"><img src="URL" alt="INBOX"></a>
<a href="URL"><img src="URL" alt="WRITE A NEW MESSAGE"></a>
<a href="URL"><img src="URL" alt="SAVED"></a>
<a href="URL">><img src="URL" alt="OUTBOX"></a>
<a href="URL"><img src="URL" alt="SENTBOX"></a>
</div>
<h3 onClick="expandcontent('sc2')" style="cursor:hand; cursor:pointer">
<img src="URL" alt="PROFILE"></h3><div id="sc2" class="switchcontent">
<a href="URL"><img src="URL" alt="INFORMATIONS"></a>
<a href="URL"><img src="URL" alt="PREFERENCES"></a>
<a href="URL"><img src="URL" alt="SIGNATURE"></a>
<a href="URL"><img src="URL" alt="AVATARS"></a>
<a href="URL"><img src="URL" alt="FRIENDS"></a>
</div>
<h3 onClick="expandcontent('sc3')" style="cursor:hand; cursor:pointer"><img src="URL" alt="OTHER"></h3><div id="sc3" class="switchcontent">
<a href="URL"><img src="URL" alt="FAQ"></a>
<h3 onClick="expandcontent('sc4')" style="cursor:hand; cursor:pointer"><img src="URL" alt="POSTS"></h3><div id="sc4" class="switchcontent">
<a href="URL"><img src="URL" alt="SEARCH"></a>
<a href="URL"><img src="URL" alt="EGOSEARCH"></a>
<a href="URL"><img src="URL" alt="NEWPOSTS"></a>
<a href="URL"><img src="URL" alt="UNANSWERED"></a>
<a href="URL"><img src="URL" alt="ACTIVETOPICS"></a>
<a href="URL"><img src="URL" alt="FAVOURITESEARCH"></a>
<a href="URL"><img src="URL" alt="WATCHSEARCH"></a>
</div>
<h3 onClick="expandcontent('sc5')" style="cursor:hand; cursor:pointer"><img src="URL" alt="POSTERS"></h3><div id="sc5" class="switchcontent">
<a href="URL"><img src="URL" alt="MEMBERLIST"></a>
<a href="URL"><img src="URL" alt="TODAYPOSTERS"></a>
<a href="URL"><img src="URL" alt="OVERALLPOSTERS"></a>
</div></div>
</div>
<a href="URL"><img src="URL" alt="LOGOUT"></a>
I'm not trying to get the images next to each other in the widget. I'm trying to do that in display - homepage generalities - homepage message. In the widget they appear on top of each other and it's fine for the widget, but as I said I want to change it.MrMario wrote:Looks like the widget is to small to make images go next to each other. Make the widget area bigger
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
You need to add a class to your <h3> tags, then define the <h3> tags to display as inline element. To each of the <h3> tags, start them like this:
And FYI, you have an extra </p> tag in your first (sc1) menu. You might want to remove it.
- Code:
<h3 class="inline-display" (rest of tag goes here)
- Code:
h3.inline-display {display:inline;}
And FYI, you have an extra </p> tag in your first (sc1) menu. You might want to remove it.
Guest- Guest
Re: What is the code for getting images in one line
Thanks, I will try out the codes.
I have the images centred in the widget and when I posted the code here, I removed those bits in the code, I must have missed the </p>.
I have the images centred in the widget and when I posted the code here, I removed those bits in the code, I must have missed the </p>.
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
Well well.
I tried the code and now the menu looks like this:
Now, I want the dark buttons to be in one line and the lighter ones to go straight down.
What am I doing wrong?
I tried the code and now the menu looks like this:
Now, I want the dark buttons to be in one line and the lighter ones to go straight down.
What am I doing wrong?
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Re: What is the code for getting images in one line
rhe wrote:Well well.
I tried the code and now the menu looks like this:
Now, I want the dark buttons to be in one line and the lighter ones to go straight down.
What am I doing wrong?
Diana- Active Poster
- Posts : 1286
Reputation : 21
Language : English
Similar topics
» i need help with a body line transparency code
» Navigation Images & Line Break for guests
» Images instead of colors for forum & body line
» Force Navbar With Images to Remain on One Line?
» Code Out Of Line
» Navigation Images & Line Break for guests
» Images instead of colors for forum & body line
» Force Navbar With Images to Remain on One Line?
» Code Out Of Line
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum