Need Help To Widen Conatiner Holding Image

Design help General
1

Hello I need help to widen my image container to match my Nav Bar info… My picture is much larger than what is being shown on the webpage …

https://preview.webflow.com/preview/allquickrepairs?preview=b52c6a886898411340f0845482c899e9

I have an image to show you but cannot find the ATTACHMENT link?

I am sure you can see what I mean by going to my link above… I feel helpless… I will have to widen my container areas for my text info below it as well…

I am actually missing something … can you please help ASAP… bruceo

2

Hey @bruceo

Are you looking for something like this?

1354×609 407 KB

Best
Ahmad

3

Please see … what I need is the image to be larger … it is a larger image than what the container is allowing… I need to the container to be larger so I can get the image to kind of be under the left and right of the nav images…

refresh and see new web site…
http://allquickrepairs.webflow.io/

I am very unhappy with aligning the 2 images and nav buttons on the top Fixed Nav Section… the right image is almost all the way under my work area where we set right and left margines…

so I may need help with this as well to give the LOOK I have on my Wide Monitor… what you are showing is not what I was hoping to do with my Top Section…

I need the top section to be Fixed but align properly with different browsers… I am looking at a wide browser 22" .

3840×1080 645 KB

I need the big image to be Wider and a bit taller to align under the Top Section…
Can you please help… thank you… bruceo

4

I have blown it … my nav stuff looks POORLY on a narrower monitor… all not position properly… my goal was to show you what I would like it to look like but it happens that I have WRONG settings in my Nav Bar … all not centered on regular monitor… I am unhappy that my place holder image is smaller than what I need…

we have two issues… thank you… b

5

Hey @bruceo

Is this how you want your navbar to look? if so ill make a tutorial :smile:

1356×545 360 KB

Best
Ahmad

6

Yes Thank you… my top section is all out of wack and my image needs to be much wider showing than my current work area.

Oh sorry for such a large screen shot I should have shut off my second monitor before Screen Shot…

Eager for your video / instructions… I will KEEP these instructions for sure… Thank you B

7

Oh One more thing… my containers in my work area are WAY to narrow for the image and Text area…

8

Ok im making a tutorial is the image size ok in the screenshot above or should i make it wider? :smile:

9

I need the container to be 1170 wide to hold the Place Holder image… then the top left and right images to be even outside… like your picture… my problem was that the image is a good size image but the Container would not expand to my 1170 width… of course the place holder picture image will grow taller a bit… not sure what the % it was off but if you can show me what you did to widen the image then I may be able to make adjustments on my own…
thank you so much for the help… b

10

Well if you place the image in the container it cant be bigger than 940px so either you can make the image 100 percent of the users viewport or be 940px in width if you want a tutorial on how to make it 100% width i can make it. :smile:

About the top two pictures you cant have them outside of the container as they would no longer be responsive.

The navbar tutorial is uploading will put the link here when its done (For some reason the video got corrupted making a new one it might take some time :frowning: )

Best
Ahmad

11

OK let me show you what I am needing to do… http://schbuild.co.uk/ take a look…

This is a responsive site… not made in Webflow unless you can find that out… ???

their slide show image is wider than the Webflow Container… Not sure I can live with the narrower container…

Also I need the images in nav to be the same Width as Place Holder Image … slide show… home page…

so can I make this site look like the EXAMPLE site above or is this IMPOSSIBLE and if so then I will have to build it with the DEFAULT Container in Webflow… if you change the image to larger width with 100% then How can I get my images in first Section to be spread out as wide and even sides???

I had thought about using an image in the background for the first section NAV but worried it would not end up being RESPONSIVE… I have to build a RESPONSIVE website…

So what you are telling me I need to do is SETTLE on having my image smaller than the size of the image on the EXAMPLE site we were using for building this one…

If you can make a video for me that is for the image / slide show for the home page I will use your video for the Nav area … wow this was so hard for me to get right…

If you can figure out how I can get by with your skills to pull this one off I will truly be HAPPY with you and WebFlow… if you cannot do this miracle I am cool with telling my customer it is the best I can build the site as and see if he will accept the WebFlow smaller site… wow thank you so much for all the help… please stay with me on this one… bruceo

12

Hi,
the easy way is to add some custom code to adjust the width on the container element on larger screens.
See this tread for more information: http://forum.webflow.com/t/activate-1200px-large-screen-media-query/611

<style type="text/css">
  @media screen and (min-width: 1200px) {
    .w-container {
      max-width: 1170px;
    }
  }
</style>
1 Like
13

Hey Guys

Was just about to post that too @perkristian thank you :smile:

Sorry for the wait on the nav bar tutorial have been really busy with a client :smile:

Here you go: https://goo.gl/OoZvK0.

Hope this helps

Best
Ahmad

14

I dont think the google drive link is working here is another link: https://vid.me/e/xf1B. :smile:

15

Thank You I get it… will do… I should have asked you if there was a custom code setting … you solved my issue. Thank You so very very much. b

16

Hello me again, I seem not to have accomplished my task just yet… still having problems… please Help.

https://preview.webflow.com/preview/allquickrepairs?preview=2db6c9af80e67b585732b3f6a70b5697

1926×1080 1.05 MB

hopefully you can see what I have done wrong… maybe my custom Code for header is wrong… ??? thank you … b

1 Like
17

Hey @bruceo

Glad me and @perkristian were able to help you.

here is how to fix the navbar for the wider media query: http://nimb.ws/fDlv68. :smile:

Best
Ahmad

18

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.