A few questions #2 - Post ID 257248

User 2816824 Photo


Registered User
16 posts

And possibly been answered before but I can't be bothered to search right now so hope someone will kindly help!

How do you centre an image? For instance the image at the top of this page: http://highparkcommunitymusicproject.org.uk/ - not being able to play with the code I'm struggling to figure it out!! It's not essential but would look better to me if I could centre it! It's also probably really simple but I've been at this most of today and have now got squiffy eyes so can't see wood for trees!

Also, when setting social links - what information should go in the youtube link - I know I've got this wrong but can't for the life of me work out what it should be.
And, I'd like the Facebook link to go to our Facebook page, but have currently got it set as a share button as I couldn't work out what bit of info should go in to make it work as I wanted it to!

Finally, I've been getting to grips with how to make the mobile sized screen look as I want it to which in general works very nicely (still a few tweaks that could do with being sorted if I was being picky - mine, not RSD's!). I would however like to know if it would work, where I've got 3 columns near the top of this page: http://highparkcommunitymusicproject.or … ising.html - I have got them set to go one under the other when the screen narrows, however they remain in very narrow columns - is it possible for the columns to be set somehow to fill the whole available screen at that point without then losing the 3 column layout when it is in full screen mode? I did try make it so it was single columns but then that affected the full screen layout, so either I was doing it wrong or there's another option I've not found! Hope that makes sense!

Thanks in advance for your help, :)

User 187934 Photo


Senior Advisor
20,266 posts

Try setting the pictures left and right margin to auto.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2816824 Photo


Registered User
16 posts

Eric Rohloff wrote:
Try setting the pictures left and right margin to auto.


Awesome, thanks, I knew it should be something simple! Now just to sort my other things and I'll be a very happy bunny!!
User 232214 Photo


COO
827 posts

Bex Smith wrote:
is it possible for the columns to be set somehow to fill the whole available screen at that point without then losing the 3 column layout when it is in full screen mode?

Absolutely! Simply add a breakpoint at the display width where you want your 3 columns to take up the full width of the screen. Breakpoints can be added by clicking on the line above the width slider or by clicking on the + button on the left of it. Then, on the layout pane, set the span width for the columns to 12 (assuming you're using a 12 column grid). That's it!

For these and similar questions you might want to spend a few minutes on a tutorial we made that addresses all the basics of responsive site design or one that shows how to go from a static to a responsive design in detailed steps.
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 2816824 Photo


Registered User
16 posts

Bob Visser wrote:
Bex Smith wrote:
is it possible for the columns to be set somehow to fill the whole available screen at that point without then losing the 3 column layout when it is in full screen mode?

Absolutely! Simply add a breakpoint at the display width where you want your 3 columns to take up the full width of the screen. Breakpoints can be added by clicking on the line above the width slider or by clicking on the + button on the left of it. Then, on the layout pane, set the span width for the columns to 12 (assuming you're using a 12 column grid). That's it!

For these and similar questions you might want to spend a few minutes on a tutorial we made that addresses all the basics of responsive site design or one that shows how to go from a static to a responsive design in detailed steps.


Hmmm... I will have to try that again then because that was exactly what I did try last night and when I then returned the screen to full size the 3 columns remained one under the other rather than returning to where I wanted them to be!!
User 122279 Photo


Senior Advisor
14,622 posts
Online Now

If you start with the widest screen size, make sure you have no breakpoints to the right of the slider. That is a common mistake made by a bunch of people now.
Start without any breakpoint is my advice, and create the design you want for large monitors. Then you move the slider towards the left, and when your design doesn't fit the available width any more (or rather a little before that), click the plus sign to set a breakpoint (forgetting to set a breakpoint is another common mistake), and adjust your design. When done, move the slider to the left again and repeat the process as many times as needed.
Good luck!
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2816824 Photo


Registered User
16 posts

Inger wrote:
If you start with the widest screen size, make sure you have no breakpoints to the right of the slider. That is a common mistake made by a bunch of people now.
Start without any breakpoint is my advice, and create the design you want for large monitors. Then you move the slider towards the left, and when your design doesn't fit the available width any more (or rather a little before that), click the plus sign to set a breakpoint (forgetting to set a breakpoint is another common mistake), and adjust your design. When done, move the slider to the left again and repeat the process as many times as needed.
Good luck!


Thank you, sound advice and pretty much the way I ended up working through the design on this site after one first attempt as I started to learn how RSD worked! I have literally just tried again what Bob said and that's worked this time (pass on why it didn't last night as nothing else has changed!)

Now, just need to find some info on what needs to be entered for my youtube and facebook links to do what I want them to and I'll be sorted :)

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.