WordPress.com is an easy way to start blogging. Get a blog, check out our features, read the latest announcements, choose from great themes, or learn about the team behind it.
Need help? Check out our Support site, then
hey there!
I'm new to CSS (really new!), and I'd like to manage to be able to put 2 videos (small vimeo frames) one beside the other, rather than one under the other, in a post. But I don't know how to achieve this... can someone help me please? Or send me to a link that explains how to do it (for noobs)?
Thanks!
Bill
The blog I need help with is williamkraushaar.com.
ps: it seems that the width of the content of the post can't exceed the width of the header at the top of the page, basically...
Hello there,
The custom design upgrade does come with Staff support. Please be patient while waiting for help with your CSS editing.
Useful information here > http://en.forums.wordpress.com/topic/how-to-make-coraline-full-width?replies=13#post-550249
How to here instructions here > http://en.forums.wordpress.com/topic/change-width-of-theme-1?replies=13#post-776950
thanks timechief,
I've looked into those links and have noticed that I already have done what I need to do to have the most width possible (using the no sidebar option), but I still can't manage to put 2 videos one next to the other...perhaps even 990 pixels is still not wide enough for that...
I don't think so, unless you reduce the size of the videos. There's not only the video width, but the frame width too. If you make them both 400 px they might work.
've looked into those links and have noticed that I already have done what I need to do to have the most width possible (using the no sidebar option), but I still can't manage to put 2 videos one next to the other...perhaps even 990 pixels is still not wide enough for that...
Have you tried puting the 2 videos in a table of 1 row by 2 columns? It is worth a try.
<table><br />
<tr><br />
<td>Video 1 goes here</td><br />
<td>Video 2 goes here</td><br />
</tr><br />
</table>
When this done and if it still does't work then you could insert explicit width size of the two columns in the above code. But do one step at a time.
Good luck.
hey there
yes I've tried something similar:
<table><tr><td>
**paste code for photograph 1 here**
</td><td>
**paste code for photograph 2 here**
</td></tr></table>
but still, I have to reduce the size of each video considerably for them to "fit" within the width of my header.
I'd sure like to try that "insert explicit width size of the two columns in the above code" that you are talking about but I don't know how to... :s
Ps: actually it seems like there's a little extra room at the right that I should be able to use (considering that my content can't exceed the width of the head banner) but somehow it won't let my two videos stick side by side in that full potential space...
Try this code:
<table style="margin-left:auto;margin-right:auto;"><br />
<tr><br />
<td style="width: 495px; text-align:center;">Video 1 goes here</td><br />
<td style="width: 495px; text-align:center">Video 2 goes here</td><br />
</tr><br />
</table>
Let us see what happens. You might need to change the 495px to slightly less just in case it has borders and margins. With WP CSS style sheet, we are not able to change the main/default style sheet so we need to improvise using inline styles.
Good luck.
my god you're a genius!
the only thing now is I have a ugly gray little frame around the 2 videos...is there any way to get rid of that?
thanks a bunch!
OK now change the fist line of the code to this one:
<table style="margin-left:auto;margin-right:auto; border: 0;">
In the above code, I have inserted border: 0; as additional table property.
See if this works.
wow...you've got the skillz!
thanks a lot for your patience and quick replies, it's working fine now!
can I also just change 495px to higher if ever I just want to make the whole thing wider to increase the size of the videos (since they're kinda small now, in order to fit next to each other...)?
First, table cells in the theme you'r using have default padding you need to override. Second, a table is used for items in rows and columns: you don't use a table for just a couple of items. This is what you need:
<div style="float:left;">
[vimeo http://vimeo.com/39498131 w=480]
</div>
<div style="float:right;">
[vimeo http://vimeo.com/37992053 w=480]
</div>
<br style="clear:both;" />Sure you can change the code as you wish; Just keep an eye on how it looks in the browser at each change so that you can reverse it if it doesn't work.
Good luck.
damn I have so much to learn about html...thanks guys, everything is working just the way I wanted!
You're welcome.
This topic has been closed to new replies.
