Cleaner Post Div

[icasm]

Can it be done? Instead of the user info spanning the entire left side of the post wrapper, it only uses as much space as it needs.

[Ricky.]

Yes, it can be done, you may have to strip down few things. Anyways, what SMF version you are using ?

[icasm]

2.3.2

I'm using the default Curve theme.

[Hj Ahmad Rasyid Hj Ismail]

2.3.2

I'm using the default Curve theme.

There is no such version. There is SMF 2.0 RCx and SMF 2.0 (gold of course). What you want to do is actually to float the whole poster info to the left. For this you may want to create a new div in your Display.template.php to float the whole poster info like <div style="float:left;>. You might want to limit your poster info to the very minimum just like the attached image too, so in this case certain code in poster info part (which is quite a lot) need to be removed or comment off.

[Ricky.]

In default css file :
Find :

Code Select Expand

.post, .personalmessage {
    line-height: 1.4em;
    overflow: auto;
    padding: 0.1em 0;
}

Replace it with

Code Select Expand


.post, .personalmessage {
    line-height: 1.4em;
    padding: 0.1em 0;
}

Also Find :

Code Select Expand

.postarea, .moderatorbar {
    margin: 0 0 0 16em;
}
Replace with :

Code Select Expand

.postarea, .moderatorbar {
    margin: 0 0 0 1em;
}

This is just basic idea, you may need to modify little more CSS to achieve what you need.

Lols.. regarding version, I am not sure what he may have checked for version but I only wanted to know about theme, that is enough!

[icasm]

2.0.. my mistake. xD



That was my result.



This is what I'm going for.

[Hj Ahmad Rasyid Hj Ismail]

Meaning you have done it?

[Ricky.]

Well, the code I gave you was tested to some extend and I think you have achieved what you wanted !

[icasm]

Again.. my mistake. The second image is just a PS mockup to show you what I'm trying to achieve. I haven't actually done so. The other code edits you provided were helpful though! I hope this isn't considered advertising, but you can take a look for yourself if you'd like. click

[MrGrumpy]

I don't belive you will achieve this with css edits alone, you are probably going to need to edit the Dispaly.template.php and move the box for the user info/postprofile (.poster) into the main body of the post (.postarea)

[icasm]

Hrm.. how about this?

[Hj Ahmad Rasyid Hj Ismail]

I agree with MrGrumpy. It may be looking properly by simply editing CSS though it may be possible like what have been done here with smf main menu. I have a mod (Poster Info To Top) that move poster info to top with several modifications on Display.template.php and index.css. That can be used as a guideline, if you like.

The concept that you are trying to achieve is something like Xenforo where the poster is separated in a different box. A sample may be viewed in this live site here.

I have also written a tip or trick on how to rearrange your post page to be like Xenforo here. I may update it so it have a better look (well separate box for poster info like Xenforo is really nice, isn't it?). But first, let me do some further test. I'll post back later.

[Eliana Tamerin]

The CSS attribute float is what you need.

[MrGrumpy]

A float attribute won't solve this, this is going to need the post section of the Display.template.php modified and css tweeked.

At the moment my pc is dismantled due to decorating and i'm on my laptop that doesn't have any of my programs or files for editing smf but I will hook it back up tomorrow and look at the coding for this and try to post the solution to do it or at least point you in the right direction.

[Hj Ahmad Rasyid Hj Ismail]

I have tested and my finding is that it is possible to achieve the above just by modifying the styling in index.css. I have posted a tip or trick for this in the graphic section here (may be moved to tip and trick section later).

Regarding this second format, I hope you can try it on your own using the given tip or trick. Otherwise, wait for my update to Xenforo Like Display / Post Page. I'll try to include the Poster Info section modification (or beautification, hah ha) later on.

[icasm]

I have tested and my finding is that it is possible to achieve the above just by modifying the styling in index.css. I have posted a tip or trick for this in the graphic section here (may be moved to tip and trick later).

Regarding this second format, I hope you can try it on your own using the given tip or trick.

Thanks! That's exactly what I was looking for. If I can figure out the second bit I'll post it here.

[MrGrumpy]

I was planning on doing something different with the layout but if that works for you then cool.

[Hj Ahmad Rasyid Hj Ismail]

I can see that you have several custom themes. They are very cool too. 

[MrGrumpy]

Thanx, meaning to make some more but in the middle of decorating my house from top to bottom so it's slowing me down.

[icasm]

I can see that you have several custom themes. They are very cool too. 

Agreed.

Sorry to go off-topic, but how do you use the Anchor tag? I looked it up, tried the code, and yeh.. didn't work. Are you able to anchor content within the same post, or does it only redirect to other posts?

nvm, figured it out! :]